更改链接上的类后,为什么点击功能不会与新类绑定？

Question

我有一个链接,当点击它,做东西,然后交换类别的东西.

我希望能够像第一次那样与新课程互动,但我似乎无法这样做.为什么这样,我该怎么办？

http://jsfiddle.net/3uJEa/

HTML:

<a class="state-one" href="javascript:void(0);">What is the capital of Assyria?</a>

JavaScript的:

$('.state-one').click(function() {
    $(this).html("Strange women lying in ponds distributing swords is no basis for a system of government!");
    $(this).addClass("state-two").removeClass("state-one");
});

$('.state-two').click(function() {
    $(this).html("What is the capital of Assyria?");
    $(this).addClass("state-one").removeClass("state-two");
});

Answer 1

$(...).click(...)将处理程序绑定到元素.更改元素的属性不会更改绑定到它的处理程序.您正在寻找事件委托on():

http://jsfiddle.net/RaSrm/

$(document).on('click', '.state-one', function() {
    $(this).html("Strange women lying in ponds distributing swords is no basis for a system of government!");
    $(this).addClass("state-two").removeClass("state-one");
});

$(document).on('click', '.state-two', function() {
    $(this).html("What is the capital of Assyria?");
    $(this).addClass("state-one").removeClass("state-two");
});