Select nth Child Elements $(":nth-child(n)")

$(":nth-child(n)")

e.g. $("div:nth-child(n)") n:{integer e.g. [1,2,...,n], even, odd or equation e.g. (n+2) n= [0,1,...,n] }

$(":nth-child(n)") selects elements if they arenth child of their parents.

$(":nth-child(1)") is equivalent to $(":first-child")
Example 1: $("li:nth-child(2)") will select all <li> elements if they are 2nd child of their parents.

<ul>
<li>1st</li>
<li>2nd</li>
<li>3rd</li>
</ul>
    
<ul>
<li>1st</li>
<li>2nd</li>
</ul>
Example 2: $("li:nth-child(odd)") will select all <li> elements if they are odd child of their parents.

<ul>
<li>1st</li>
<li>2nd</li>
<li>3rd</li>
</ul>
    
<ul>
<li>1st</li>
<li>2nd</li>
</ul>
Example 3: $("li:nth-child(n+2)") will select all <li> elements if they are (n+2) child of their parents.
Notice: for equation, n starts from zero

<ul>
<li>1st</li>
<li>2nd</li>
<li>3rd</li>
</ul>
    
<ul>
<li>1st</li>
<li>2nd</li>
</ul>
Example 4: $("span:nth-child(2)") will find all <span> elements if they are 2nd child of their parents.
<div>
  <p>a</p> 
  <span>b</span> // 2nd child and <span>
  <span>c</span>
</div>
<div>
  <span>d</span>
  <p>e</p> // 2nd child but NOT <span>
  <span>f</span>
</div>
jQuery selector filter $(":nth-child(n)")