Jquery 添加一个类，然后删除它并添加另一个

因此，我想在单击时添加一个类，然后当再次单击时，我想将其恢复到上一个类。这是如何实现的。我还使用（）上的

对其进行了测试，但也没有成功


$（'.red'）。单击（函数（）{
$（this.removeClass（'red'）.addClass（'blue'）；
});
$（'.blue'）。单击（函数（）{
$（this.removeClass（'blue'）.addClass（'red'）；
});
.red{
颜色：红色；
}
蓝先生{
颜色：蓝色；
}


使用
.toggleClass（）
因为按钮具有动态类，所以对动态添加的元素使用
.on（）

$（文档）.on（'click'，'red'，函数（e）{
e、 预防默认值（）；
$（this.toggleClass（'red-blue'）；
});
$（文档）.on（'单击'，'.blue'，函数（e）{
e、 预防默认值（）；
$（this.toggleClass（'red-blue'）；
});
.red{
颜色：红色；
}
蓝先生{
颜色：蓝色；
}


使用
.toggleClass（）
因为按钮具有动态类，所以对动态添加的元素使用
.on（）

$（文档）.on（'click'，'red'，函数（e）{
e、 预防默认值（）；
$（this.toggleClass（'red-blue'）；
});
$（文档）.on（'单击'，'.blue'，函数（e）{
e、 预防默认值（）；
$（this.toggleClass（'red-blue'）；
});
.red{
颜色：红色；
}
蓝先生{
颜色：蓝色；
}
对于新创建的元素或类，
。单击
，因为您使用的将不起作用。您必须按以下方式使用方法：

$(document).on('click','.red', function(){

                $(this).removeClass('red').addClass('blue');
            });


 $(document).on('click','.blue', function(){

                $(this).removeClass('blue').addClass('red');
            });

对于新创建的元素或类，
。单击所用的
，将不起作用。您必须按以下方式使用方法：

$(document).on('click','.red', function(){

                $(this).removeClass('red').addClass('blue');
            });


 $(document).on('click','.blue', function(){

                $(this).removeClass('blue').addClass('red');
            });

toggleClass
是您的朋友，您需要在此处使用事件委派。执行时，您的
$（'.blue'）
找不到类为
.blue
的元素，因此未创建任何事件处理程序。您需要使用
$（文档）。在（'click'，'.blue'，function（）{…
toggleClass
是您的朋友。您需要在此处使用事件委派。您的
$（'.blue'）
在执行时找不到类为
.blue
的元素，因此，没有创建事件处理程序。您需要使用
$（文档）。on（'click'、'.blue'，函数（）{…
简洁的解决方案，没有解释需要更改的内容和原因。您对toggleClass的使用不是主要的更改。而且这个答案有点误导性，不需要使用
toggleClass
两次！就像下一个答案一样，使用它一次切换
blue
@Pedram下一个答案与这个答案相比是错误的，但是我同意，另一个答案是错误的，这是正确的方法为什么？你可以用一个
toggleClass
来实现这一点，为什么要用两次，请用一个更新来解释，有趣的是知道。两者都是相同的结果。简洁的解决方案缺少解释需要更改的内容和原因。你对toggleClass的使用不是主要的改变。这个答案也有点误导，不需要使用
toggleClass
两次！就像下一个答案一样，用它一次切换
blue
@Pedram下一个答案与这个答案相比是错误的，但它的我再次同意，另一个答案是错误的，这是正确的方法为什么？你可以用一个
toggleC来实现这一点lass
，为什么要用两次，请用更新说明，很有意思。两者都是相同的结果。