Bryce
Bryce

Reputation: 45

classList.toggle not working

I'm trying to toggle a cssclass using jQuery on an SVG element each time a div element is clicked.

From what I've read, there are issues doing this with SVG elements and this way was a solution:

$("#div1").click(function() {
    $("#svg1").classList.toggle("clicked");
});`

However, this doesn't work. So I assumed it was due to the use of an SVG element in this function. But when replacing said SVG element with a div element, like this:

$("#div1").click(function() {
    $("#div2").classList.toggle("clicked");
});

the class still won't toggle, despite there being no SVG element in the function.

Upvotes: 1

Views: 20078

Answers (2)

Sumon Kaysar
Sumon Kaysar

Reputation: 51

Toggle class function in jQuery is toggleClass():

$("#div1").click(function() {
    $("#div2").toggleClass("clicked");
});

Upvotes: 2

baao
baao

Reputation: 73301

Please try it with plain javascript, I don't think jQuery has this method.

$("#div1").click(function() {
    document.getElementById('div2').classList.toggle("clicked");
 });

DEMO

Upvotes: 6

Related Questions