jQuery选择，选择一个比一个不同的元素点击

Question

这是简化的HTML：

<div id="l01"> 
<ul style="width:450px;"> 
<li><img src="images/iconarrow.gif" alt="arrow" width="9" height="11" align="left" />&nbsp; 
<a href="#">Preview</a>        
</li> 

<li class="showStats"><a class="showstatlink" href="javascript:{}"><img class="sstatsImage" src="images/iconarrow.gif" />&nbsp; 
         Show Stats</a>        
</li>       
</ul>      
</div> 
<div class="sstatsDetails"> 
     ... 
</div> 

我想点击类=“showstatlink”，和我想，点击触发类的切换= 'sstatsDetails'，但只有下一个，我不希望页面上的所有元素都与该类切换。

Answer 1

$(".showstatlink").click(function() { 
    // Your code to handle the event. 
    $(".sstatsDetails").show(); // Or hide whatever you want to do. 
}); 

Answer 2

尝试是这样的：

$(".showstatlink").on("click", function(){ 
    $(this).parent().parent().parent().next(".sstatsDetails").toggle(); 
}); 

你可以看到它在行动here.