Javascript 使用jQuery通过添加/删除类来控制单击事件

我目前运行的代码如下：

function blah() {
jQuery(".class1").on("click", function() {
    jQuery(this).text('Validate').addClass('class2').removeClass("class1");
   //more stuff here
    jQuery(".class2").on("click", function() {
           jQuery(this).removeClass("class1");
           //More stuff here

这是不好的，因为单击事件会传播，每次单击都会多次添加单击事件。我尝试关闭第一个选择器（像这样）并单独设置单击事件，但第二个单击事件从未发生（！）：

如何构造代码，以便在第一次单击时发生一件事，而在第二次单击时发生另一件事，而不发生所需的单击事件

jQuery(document).on("click", ".class1", function() {
    jQuery(this).text('Validate').addClass('class2').removeClass("class1");
});
jQuery(document).on("click", ".class2", function() {
           jQuery(this).removeClass("class1");
           //More stuff here
});

---

演示：

我感觉你是在试图得到帮助来修复一个黑客，而不是你原来遇到的问题。你能确切地解释一下你想做什么吗？这样，我们实际上可以为您提供更好的答案。另外，如果您能提供一个[fiddle]（jsfiddle.net）来演示您的问题，那将非常有用。这是正确的，我将在上午提供详细的解释。我想在这方面做得更好。

jQuery(document).on("click", ".class1", function() {
    jQuery(this).text('Validate').addClass('class2').removeClass("class1");
});
jQuery(document).on("click", ".class2", function() {
           jQuery(this).removeClass("class1");
           //More stuff here
});