.addClass只到在无序列表中单击的项目符号

Question

我有一个带有两颗子弹的短无序列表。

我添加了一些Javascript，所以当我点击子弹时，它会为它添加一个类。

问题是，它将类添加到所有现有的li，而不仅仅是我点击的那个。

这是JSFiddle：http://jsfiddle.net/4sa8T/

使用Javascript：

$("#items li a").click(function(){

$("#items li").addClass("newClass");

});

HTML：

<div id="content">
    <ul id="items">
    <li><a href="#">Hello</a></li>
    <li><a href="#">Bye</a></li>    
    </ul>
</div>

Answer 1

$("#items li a").click(function(){
    $("#items li").addClass("newClass");
});

应该是

$("#items li a").click(function(){
    $(this).parent().addClass("newClass");
});

$(this).parent()会引用特定的li元素，$('#items li')会引用li下的所有 #items

Answer 2

最适合您的解决方案是：

$(this).toggleClass('newClass');

美元此表示使用特定的点击元素...

toggleClass 是一种通过再次点击该元素来删除添加的类的简单方法。

这是一个演示jsfiddle