DeeDi - трезвые записки

:nth-child(index | even | odd | equation). n-ный потомок (индекс | четный | нечетный | формула)

Выбирает все элементам, которые являются “N-ными потомками” либо четными/нечетными “потомками”.
В сравнении с :eq(index), который выбирает лишь один элемент, данный селектор - может выбирать более 1 - один для каждого родительского элемента с индексом (index) и несколько для каждого родительского объекта с even, odd или формулой. Указанный в данном селекторе индекс начинается с 1, в отличие от :eq(), где он начинается с 0.

В первом примере ищем каждый третий элемент-потомок у элемента .example_data. Во втором - каждый четный ..example_data2:

$(document).ready(function() {
$(".example_data span:nth-child(3)").css("color", "red");
$(".example_data2 span:nth-child(even)").css("color", "red");
});
Результат работы примеров:

HTML : )
<div class="example_data">
<span>span_1 </span><span>span_2 </span><span>span_3 </span><span>span_4 </span><span>span_5 </span>
</div>
<div class="example_data">
<span>span_1 </span><span>span_2 </span><span>span_3 </span><span>span_4 </span><span>span_5 </span>
</div><div class="example_data2">
<span>span_1 </span><span>span_2 </span><span>span_3 </span><span>span_4 </span><span>span_5 </span>
</div>
<div class="example_data2">
<span>span_1 </span><span>span_2 </span><span>span_3 </span><span>span_4 </span><span>span_5 </span>
</div>

Боковой текст: