javascript - JQuery 切换和删除 css 类

Question

我有以下 CSS:

.red {background-color: #CC0000;}
.green {background-color: #009900;}

我的 HTML 是:

div class="red" id="ch1">Content</div>
<div class="red" id="ch2">Content</div>
<div class="red" id="ch3">Content</div>
...
<div class="green" id="ch..">Content</div>
<div class="red" id="ch..">Content</div>

我正在使用以下脚本更改 div 上的类:

$(document).ready(function() { 
$(".red , .green").click(function(){
    $(".green").removeClass("green").addClass("red");
     $(this).toggleClass('red green');
});   
});

将 div 类 onclick 从 .red 更改为 .green 效果很好，但是当我单击“绿色”时，div 不会变为“红色”。换句话说，我想拥有或所有“红色”或只有一个“绿色”div如果我在 CSS 中更改 .red - .green 的顺序，也没有任何效果

有什么想法吗？提前致谢

Answer 1

不包含被点击的元素...

$(".green").not(this).removeClass("green").addClass("red");