如何在jQuery中选择具有相同类名的第n个元素？

Question

这是HTML输出：

<ul class="slides row">
    <li id="t64" class="span3"></li>
    <li id="t65" class="span3"></li>
    <li id="t67" class="span3"></li>
    <li class="detailView desktopView"></li>
    <li id="t66" class="span3"></li>
    <li id="t68" class="span3"></li>
    <li class="detailView desktopView"></li>
    <li class="detailView mobileView"></li>
</ul>

我正在尝试仅使用类名.span3选择第n个元素。 所以我尝试了这个：

var targetSlide = 3;
$(".slides").children('.span3:eq('+ targetSlide +')').addClass('on');

或

var targetSlide = 4;
$(".slides").children('.span3:nth-child('+ targetSlide +')').addClass('on');

在这两种情况下都选择了.detailView。任何想法？

Answer 1

这应该有效：

var targetSlide= 3;

$('.slides').find('.span3').eq(targetSlide).addClass('on');

// or this syntax does the exact same thing

$('.slides').find('.span3:eq('+targetSlide+')').addClass('on');

Answer 2

你也可以使用它，

var targetSlide = 3;
$(".slides").children('.span3').filter(':eq('+ targetSlide +')').addClass('on');

Answer 3

尝试：

var targetSlide = 3;
$('.slides').find('.span3').eq(targetSlide).addClass('on');