JQuery атрибут класса инвертного по щелчку

Question

С помощью этой простой разметки:

<a id="foo" class="first" href="#"></a> 

Я хочу, чтобы получить что-то вроде этого:

$('#foo').click (function() { 
    if $('foo').hasClass('first') { $('foo').removeClass('first').addClass('second'); 

    if $('foo').hasClass('second') { $('foo').removeClass('second').addClass('first'); 
}); 

Я не знаю, до того, какой класс имеет элемент, если " первый "или" второй ". Как это можно сделать каждый раз, когда я нажимаю на элемент, обновляя чтение класса?

Хотел бы я быть ясным.

Любая помощь будет оценена.

Заранее спасибо.

Answer 1

Лучший способ использовать toggleClass() для переключения более одного класса в то время, чтобы пройти несколько классов к нему в то же время, как это:

$('#foo').click(function() { 
    $(this).toggleClass('first second'); 
}); 

Вы можете см. здесь: http://jsfiddle.net/jfriend00/HWkWC/

Примечание: вы можете передать более одного класса в toggleClass() (разделенные пробел), и он будет переключаться каждый класс самостоятельно, а не делать несколько вызовов до toggleClass(). Все это описано в jQuery doc для toggleClass.

Answer 2

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

$('#foo').click(function() { 
    $(this).toggleClass('first').toggleClass('second'); 
}