如何在jquery中select第n个子元素？

Question

我有这样的结构

<li id="step1_li">
 <a>...</a>
 <a>...</a>
</li>

我想要select第二个'a'标签，

我正在使用

$('#step1_li :nth-child(2) a').addClass("hide");

但是还是不行，请指出我哪里不对。

Answer 1

你写错了。就像 CSS

$('#step1_li a:nth-child(2)').addClass("hide");

如果您想找到一个 nth 元素，那么您需要将 :nth- 附加到该元素，在本例中是 a 元素

$('#step1_li  a:nth-child(2)').addClass("hide");

.hide { color:red;font-weight:bold}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li id="step1_li">
 <a>...</a>
 <a>...</a>
</li>

Answer 2

$( "li a:nth-child(2)" ).addClass("hide");

用这个....

Answer 3

$(document).ready(function(){
  $("#step1_li a:nth-child(2)").hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<li id="step1_li">
 <a>1</a>
 <a>2</a>
 <a>3</a>
</li>

How to select nth child element in jquery?