Wie Klasse zwischen zwei Elementen mit jQuery wechseln

Question

Ich denke, dass diese Frage bereits gestellt wurde, aber ich kann keine Antwort finden arbeiten oder Fragen, die mein Problem widerspiegeln. Mein Problem ist, ich habe derzeit 2 <div> und ich möchte, dass sie die Klasse nach einem onClick Ereignis wechseln.
Zum Beispiel, wenn ich auf ein div klicke, möchte ich, dass es eine Klasse namens isSelected hat und wenn das 2. div die Klasse haben würde, möchte ich es entfernen. Ich möchte nicht einfach das angeklickte div zwischen isSelected umschalten, ich möchte, dass das andere div 'losgeht' es ist isSelected Klasse.

Answer 1

Sie einfach ein Klasse-Selektor jedes Element mit der bestimmten Klasse zum Ziel verwenden könnte, und entfernen Sie es ....

$("#myDiv").on("click", function() { 
    $(".isSelected").removeClass("isSelected"); 
    $(this).addClass("isSelected"); 
}); 

Dies würde funktionieren, egal wie viele wählbare divs Sie haben ...

Answer 2

versuchen

$(".divclass").click(function(){ 
    $(".divclass").removeClass("isSelected"); 
    $(this).addClass("isSelected"); 
}); 

diese beiden Geschwister gleiche Klasse Angenommen divclass

Answer 3

$("div").click(function(){ 
 
    $("div").removeClass("isSelected"); 
 
    $(this).addClass("isSelected"); 
 
});

.isSelected { 
 
    background-color:red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="">test 1</div> 
 
<div class="">test 2</div> 
 
<div class="">test 3</div>

Answer 4

ein div wird Unter der Annahme haben immer in der Klasse, die Sie

$("#myDiv").on("click", function() { 
    $('#div1, #div2').toggleClass('isSelected'); 
}) 

Answer 5

Dies sollte tun, was Sie brauchen können.

$("div").click(function(){ 
 
    $("div").removeClass("isSelected"); 
 
    $(this).addClass("isSelected"); 
 
});

.isSelected { 
 
    background-color:blue; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="">1</div> 
 
<div class="">2</div> 
 
<div class="">3</div>