在添加jQuery的类之间进行替换

我有一个3个div，当单击一个div时，jQuery脚本会添加一个类：

.red{ background-color: red; }

我想做的是修改jQuery，以便在添加.red类时，下次它将添加

.blue

、

.red

、

.blue

等等

我的脚本提示您可以这样做：

很抱歉，我没有分享更多，但我可怕的尝试只会让人困惑

我希望我已经说清楚了，如果没有请问

提前谢谢

更新：

$a.addClass('red').click(function(){
    $(this).toggleClass('red blue');
});

我认为这个问题不够清楚，因此我将尝试进一步解释。

---

基本上需要三个div，第一次点击，将点击的div变成红色，第二次点击，将点击的div变成蓝色，红色等等，他们应该切换（第一次点击时变成红色或蓝色是唯一重要的一个）

编辑：根据下面的评论，这听起来像是您希望为单击的每个后续项目交替使用颜色，因此无法使用该颜色

这应该做到：

示例：

这使用闭包来包装变量。如果你不想/不需要，这里有同样的东西没有关闭

示例：

---

原始答案：

$a.addClass('red').click(function(){
    $(this).toggleClass('red blue');
});

这将首先在页面加载时添加

red

类，然后在每次单击时切换

red

和

blue

如果希望在项目上不使用任何类就开始，则可以执行以下操作：

$a.click(function(){
    if( !this.className ) {
        this.className = 'red';
    } else {
        $(this).toggleClass('red blue');
    }
});

---

太棒了！！非常感谢。这和我问的不完全一样（因为我描述不正确！）我会尝试修改它，也许以后再问：）@patrick问题是我不想打开切换，我的问题是他们不应该回到上一个，你选择的那个保持不变（像以前一样），但现在是红-蓝。我不知道我是否解释过myself@Akinator：我明白了。但是他们如何在红色和蓝色之间做出选择呢？或者你的意思是他们单击的第一个项目是红色，然后下一个项目是蓝色，依此类推？@patrick不，你不是在选择第一个项目，你选择的第一个项目变为红色，第二个项目变为蓝色，它们不能被改回，清楚吗？非常感谢，很抱歉开头的描述不好@我想我现在明白了。我马上更新。

$a.addClass('red').click(function(){
    $(this).toggleClass('red blue');
});

$a.click(function(){
    if( !this.className ) {
        this.className = 'red';
    } else {
        $(this).toggleClass('red blue');
    }
});