Element.className

Summary

className gets and sets the value of the class attribute of the specified element.

Syntax

var cName = elementNodeReference.className;
elementNodeReference.className = cName;

• cName is a string variable representing the class or space-separated classes of the current element.

Example

let elm = document.getElementById('item');

if(elm.className === 'active'){
    elm.className = 'inactive';
} else {
    elm.className = 'active';
}

Notes

The name className is used for this property instead of class because of conflicts with the "class" keyword in many languages which are used to manipulate the DOM.

className can also be an instance of SVGElement if the element is an SVGAnimatedString. It is better to get/set theclassName of an element using Element.getAttribute and Element.setAttribute if you are dealing with SVG elements.

elm.setAttribute('class', elm.getAttribute('class'))

Specifications

Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

See also

• element.classList