:nth-of-type() Selector

Selects all elements that are the nth child of their parent in relation to siblings with the same element name.


index Number/StringThe index of each child to match, starting with 1, the string even or odd, or an equation ( eg. :nth-of-type(even), :nth-of-type(4n) )

Because jQuery's implementation of :nth- selectors is strictly derived from the CSS specification, the value of n is "1-indexed", meaning that the counting starts at 1. For other selector expressions such as .first() or .eq() jQuery follows JavaScript's "0-indexed" counting.

Further discussion of this usage can be found in the W3C CSS specification.

Find each span that is second in relation to its sibling spans.

  <span>John</span>, <b>Kim</b>, <span>Adam</span>, <b>Rafael</b>,
  >, <span>Richard</span>, <span>Ralph</span>,
.nth {
  color: red;
  .append("<span> is 2nd sibling span</span>")

Looking for a Web Developer?


Hi! I'm Basti, author of this site. If you are looking for a web developer with 15+ years of experience, holla at me!

Be it the good 'ol jQuery, vanilla JS or modern frameworks like Vue and Svelte, front- or backend, I can help you.

Just write me at jobs@jqapi.com :)