HTML DOMTokenList add() Method

Definition and Usage

add() The method adds one (or more) tokens (tokens) to the DOMTokenList.

Instance

Example 1

Add the class "myStyle" to the element:

const list = element.classList;
list.add("myStyle");

}

Example 2

Remove the class "myStyle" from the element:

const list = element.classList;
list.remove("myStyle");

}

Example 3

Toggle the open/close state of "myStyle":

const list = element.classList;
list.toggle("myStyle");

}

Example 4

Add multiple classes to the element:

const list = element.classList;
list.add("myStyle", "anotherClass", "thirdClass");

}

Example 5

Get the number of class markers of the element:

const list = element.classList;
let numb = list.length;

}

Example 6

Get the class marker of the "myDIV" element:

const list = document.getElementById("myDIV").classList;

}

Example 7

Get the class marker of the "myDIV" element:

let className = element.classList.item(0);

}

Example 8

Does the element have the "myStyle" class marker?

let x = element.classList.contains("myStyle");

}

Example 9

If the element has the "myStyle" class marker, delete "anotherClass".

if (element.classList.contains("mystyle")) {
  element.classList.remove("anotherClass");

}

Try It Yourself

Syntaxdomtokenlisttoken.add(

)

) Description
token Required. The token to be added to the list.

Return Value

None.

Browser Support

domtokenlist.add() It is a DOM Level 4 (2015) feature.

It is supported by all browsers:

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Supported Supported Supported Supported Supported

Internet Explorer 11 (and earlier versions) does not support domtokenlist.add().

Related Pages

length Property

item() Method

remove() Method

toggle() Method

replace() Method

forEach() Method

entries() Method

keys() Method

values() Method

DOMTokenList Object