Jquery删除类的多个元素

Jquery删除类的多个元素,jquery,addclass,elements,Jquery,Addclass,Elements,我通过下面的代码单击按钮将一个类设置为多个元素: $('button.but1').on('click', function() { $(".div1,.div2,.div3").addClass("focus"); $(".div1,.div2,.div3").css("z-index", "99"); $(".div1,.div2,.div3").css("opacity", "1"); }); $('button.but2').on('click', functio

我通过下面的代码单击按钮将一个类设置为多个元素:

$('button.but1').on('click', function() {
    $(".div1,.div2,.div3").addClass("focus");
    $(".div1,.div2,.div3").css("z-index", "99");
    $(".div1,.div2,.div3").css("opacity", "1");
});
$('button.but2').on('click', function() {
    $(".div4,.div5,.div6").addClass("focus");
    $(".div4,.div5,.div6").css("z-index", "99");
    $(".div4,.div5,.div6").css("opacity", "1");
});
HTML:


但是1
但是2
我遇到的问题是,我只希望选择的
div
为“焦点”(类),所有其他div,而不是来自同一组的div,都需要删除“焦点”类。
不确定要去哪一个?

在将类添加到元素集之前,可以删除已添加的类。如下所示:

 $(".focus").removeClass("focus");
 $(".div4,.div5,.div6").addClass("focus");
完整代码:

$('button.but1').on('click', function() {
  $(".focus").removeClass("focus");
  $(".div1,.div2,.div3").addClass("focus");
  $(".div1,.div2,.div3").css("z-index", "99");
  $(".div1,.div2,.div3").css("opacity", "1");
});

$('button.but2').on('click', function() {
  $(".focus").removeClass("focus");
  $(".div4,.div5,.div6").addClass("focus");
  $(".div4,.div5,.div6").css("z-index", "99");
  $(".div4,.div5,.div6").css("opacity", "1");
});

只需首先从所有“其他”div中删除该类:

$('button.but1').on('click', function() {
    $(".div4,.div5,.div6").removeClass("focus");
    $(".div1,.div2,.div3").addClass("focus");
    $(".div1,.div2,.div3").css("z-index", "99");
    $(".div1,.div2,.div3").css("opacity", "1");
});
$('button.but2').on('click', function() {
    $(".div1,.div2,.div3").removeClass("focus");
    $(".div4,.div5,.div6").addClass("focus");
    $(".div4,.div5,.div6").css("z-index", "99");
    $(".div4,.div5,.div6").css("opacity", "1");
});
$('button.but1').on('click', function() {
    $(".div4,.div5,.div6").removeClass("focus");
    $(".div1,.div2,.div3").addClass("focus");
    $(".div1,.div2,.div3").css("z-index", "99");
    $(".div1,.div2,.div3").css("opacity", "1");
});
$('button.but2').on('click', function() {
    $(".div1,.div2,.div3").removeClass("focus");
    $(".div4,.div5,.div6").addClass("focus");
    $(".div4,.div5,.div6").css("z-index", "99");
    $(".div4,.div5,.div6").css("opacity", "1");
});