GV

GeezerVison

The World Wide Web, restored to 800 pixels of glory.

Home|About|Gaming cabinet|Archives|How it works|Starter sites

On this site

  • MDN
  • HTML: Markup language
  • Elements
  • Global attributes
  • Attributes
  • See all…
  • Responsive images
  • HTML cheatsheet
  • Date & time formats
  • See all…
  • SVG
  • MathML
  • XML
  • CSS: Styling language

This view

  • Original page
  • New address

GeezerVison is showing developer.mozilla.org — DOMTokenList: add() method - Web APIs | MDN

DOMTokenList: add() method

Baseline
Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

  • See full compatibility
  • Learn more

The add() method of the DOMTokenList interface adds the given tokens to the list, omitting any that are already present.

Syntax

js
add(token1)
add(token1, token2)
add(token1, token2, /* …, */ tokenN)

Parameters

tokenN

A string representing a token (or tokens) to add to the DOMTokenList.

Return value

None.

Exceptions

SyntaxError DOMException

Thrown if one of the arguments is an empty string

InvalidCharacterError DOMException

Thrown if a token contains ASCII whitespace.

Examples

In the following example, we retrieve the list of classes set on a <span> element as a DOMTokenList, using Element.classList. We then add a new token to the list, and write the list into the <span>'s Node.textContent.

First, the HTML:

html
<span class="a b c"></span>

Now the JavaScript:

js
const span = document.querySelector("span");
const classes = span.classList;
classes.add("d");
span.textContent = classes;

The output looks like this:

You can add multiple tokens as well:

js
span.classList.add("d", "e", "f");

Specifications

Specification
DOM
# ref-for-dom-domtokenlist-add①

Browser compatibility

Help improve MDN

Learn how to contribute

This page was last modified on Sep 1, 2023 by MDN contributors.

View this page on GitHub • Report a problem with this content
You are visitor 01402503 — GeezerVison does not store the pages you look up.
Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required.