js classlist add multiple classes code example

Example 1: add multiple class list at once in js

elem.classList.add("first");
elem.classList.add("second");
elem.classList.add("third");

is equal to :

elem.classList.add("first","second","third");

Example 2: html add two classes

<a href="#" class="class1 class2">My Text</a>

Example 3: add multiple classList

element.classList.add(class1,class2,class3...);

Example 4: css class list

var myElement = document.getElementById("myElementID");
myElement.classList.add("style1 style2");
myElement.classList.remove("style1 style2");

Example 5: classlist

// use the classList API to remove and add classes
div.classList.remove("foo");
div.classList.add("anotherclass");

Example 6: add to classlist javascript

Add multiple classes to a <div> element:
document.getElementById("myDIV").classList.add("mystyle", "anotherClass", "thirdClass");

Remove a class from a <div> element:
document.getElementById("myDIV").classList.remove("mystyle");

Remove multiple classes from a <div> element:
document.getElementById("myDIV").classList.remove("mystyle", "anotherClass", "thirdClass");

Toggle between two classes for a <div> element:
document.getElementById("myDIV").classList.toggle("newClassName");

Find out if an element has a "mystyle" class:
document.getElementById("myDIV").classList.contains("mystyle");

Tags:

Html Example