jQuery :nth-child() Selector

## jQuery Tutorial

jQuery HOME jQuery Intro jQuery Install jQuery Syntax jQuery Selectors jQuery Events

## jQuery Effects

jQuery Hide/Show jQuery Fade jQuery Slide jQuery Animate jQuery stop() jQuery Callback jQuery Chaining

## jQuery HTML

jQuery Get jQuery Set jQuery Add jQuery Remove jQuery CSS Classes jQuery css() jQuery Dimensions

## jQuery Traversing

jQuery Traversing jQuery Ancestors jQuery Descendants jQuery Siblings jQuery Filtering

## jQuery AJAX

jQuery AJAX Intro jQuery Load jQuery Get/Post

## jQuery Misc

jQuery noConflict()

## jQuery Examples

jQuery Examples jQuery Quiz jQuery Certificate

## jQuery References

jQuery Selectors jQuery Events jQuery Effects jQuery HTML/CSS jQuery Traversing jQuery AJAX jQuery Misc jQuery Properties

# jQuery :nth-child() Selector

jQuery Selectors

## Example

Select each <p> element that is the third child of its parent:

$("p:nth-child(3)")
Try it yourself »

## Definition and Usage

The :nth-child(n) selector selects all elements that are the nth child, regardless of type, of their parent.

Tip: Use the :nth-of-type() selector to select all elements that are the nth child, of a particular type, of their parent.

## Syntax

:nth-child(n|even|odd|formula)

Parameter | Description
--- | ---
n | The index of each child to match. Must be a number. The first element has the index number 1.
even | Selects each even child element
odd | Selects each odd child element
formula | Specifies which child element(s) to be selected with a formula (an + b). Example: p:nth-child(3n+2) selects each 3rd paragraph, starting at the 2nd child element

## Try it Yourself - Example

Select each <p> element that is the second child of all <div> elements
How to select each <p> element that is the second child of all <div> elements.

Using a formula (an + b)
How to use a formula (an + b) to select different child elements.

Using "even" and "odd"
How to use even and odd to select different child elements.

Difference between :nth-child(), :nth-last-child(), :nth-of-type() and :nth-of-last-type()
The difference between p:nth-child(2), p:nth-last-child(2), p:nth-of-type(2) and p:nth-of-last-type(2).

jQuery Selectors

## Your suggestion:

Your E-mail (optional):

Page address:

Description:

Close [X]

## Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

## WEB HOSTING

Best Web Hosting UK Reseller Hosting Wow! $5 SSD Hosting

## WEB BUILDING

Download XML Editor
FREE Website BUILDER FREE Website Creator

## WEB RESOURCES

Web Statistics Web Validation

## SHARE THIS PAGE