snippetjavascriptCritical
How to add a class to an HTML element with JavaScript?
Viewed 0 times
withhowclassaddelementhtmljavascript
Problem
I have an element that already has a class:
How can i add a class to the
...
How can i add a class to the
div (not replace, but add) with JavaScript?Solution
If you're only targeting modern browsers:
Use element.classList.add to add a class:
And element.classList.remove to remove a class:
If you need to support Internet Explorer 9 or lower:
Add a space plus the name of your new class to the
Then
Note the space before
See also element.className on MDN.
Use element.classList.add to add a class:
element.classList.add("my-class");And element.classList.remove to remove a class:
element.classList.remove("my-class");If you need to support Internet Explorer 9 or lower:
Add a space plus the name of your new class to the
className property of the element. First, put an id on the element so you can easily get a reference.
Then
var d = document.getElementById("div1");
d.className += " otherclass";Note the space before
otherclass. It's important to include the space otherwise it compromises existing classes that come before it in the class list. See also element.className on MDN.
Code Snippets
element.classList.add("my-class");element.classList.remove("my-class");<div id="div1" class="someclass">
<img ... id="image1" name="image1" />
</div>var d = document.getElementById("div1");
d.className += " otherclass";Context
Stack Overflow Q#507138, score: 2851
Revisions (0)
No revisions yet.