jquery - クリックしたアイテムにクラスを追加する方法は?

Question

リスト「abc」があります。デフォルトでは、最初のものが選択されています。menu3 をクリックすると、「current」に設定され、menu1 の「current」クラスが削除されます。jQueryを使用してこのクエリを作成するのを手伝ってください。

<ul class="abc">
    <li><a href="#" class="current">menu1</a></li>
    <li><a href="#">menu2</a></li>
    <li><a href="#">menu3</a></li>
</ul>

Answer 1

var anchors = $('li a');

anchors.on('click', function(e){
    e.preventDefault();
    anchors.removeClass('current');
    $(this).addClass('current');
});

http://jsfiddle.net/n8R6X/

Answer 2

$('.abc a').click(function(e) {
    e.preventDefault();
    $('.abc a').removeClass('current');
    $(this).addClass('current');
});​

jsFiddle の例

Answer 3

$('.abc a').on('click', function(e) {
    e.preventDefault();
    $('.abc a').removeClass('current');
    $(this).addClass('current');
}); 

見る：

• http://api.jquery.com/addClass/
• http://api.jquery.com/removeClass/

デモ: http://jsfiddle.net/KDULM/