Jquery first click addClass selected secondClass removeClass selected

Question

4つのオプションがあり、2つ以上のオプションを選択したり、選択したクラスを2回目のクリックで削除したいと考えています。

のjQuery

$('.contact-method li a').click(function(e) { 
     $('.contact-method li a').removeClass('selected'); 
     $(this).parent('a').addClass('selected'); 
     e.preventDefault(); 
}); 

HTML

<ul class="contact-method"> 
<li class="sms"><a href="javascript:void(0);">SMS</a></li> 
<li class="telephone"><a href="javascript:void(0);">Telephone</a></li> 
<li class="email"><a href="javascript:void(0);">Email</a></li> 
<li class="post"><a href="javascript:void(0);">Post</a></li> 
</ul> 

デモ

http://jsfiddle.net/XeELs/97/

Answer 1

代わりの

あなただけのアンカーノード上で選択したクラスを切り替えるために探している場合は3210

$('.contact-method li a').removeClass('selected'); 
    $(this).parent('a').addClass('selected'); 

単に

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

Answer 2

を使用し、試してみてください。

$('.contact-method li a').click(function(e) { 
    e.preventDefault();    
    $(this).toggleClass('selected'); 
}); 

http://jsfiddle.net/XeELs/99/

Answer 3

使用

toggleClass

$('.contact-method li a').click(function() { 
     $(this).toggleClass('selected'); 
}); 

Answer 4

toggleClassメソッドを使用します。

$('.contact-method li a').click(function(e) { 
    $(this).toggleClass('selected'); 
    e.preventDefault(); 
}); 

http://jsfiddle.net/XeELs/100/

http://api.jquery.com/toggleClass/