.classlist()

Provides an interface for handling class attributes as arrays of className strings:

• https://developer.mozilla.org/en/DOM/element.classList
• http://hacks.mozilla.org/2010/01/classlist-in-firefox-3-6/
• http://davidwalsh.name/classlist

Performance Evidence

• http://jsperf.com/fn-classlist-vs-fn-attr-class-split/2
• http://jsperf.com/fn-classlist-vs-fn-addclass-join

Array of Classes Survey

• Survey
• Results

API

.classlist()

• .classlist( )
• .classlist( ["set", "this", "array", "of", "classes"] )

Examples

Elements may have more than one class assigned to them. In HTML, this is represented by separating the class names with a space:

<div id="mydiv" class="foo bar baz quux"></div>

The .classlist() method will return an array of classes on first element of the matched elements:

.classlist() 
Get an array of all classes on an element
    
    $('#mydiv').classlist()
    
    > [ "foo", "bar", "baz", "quux" ]
    

The .classlist( [ "foo", "bar", "baz" ] ) method will take an array of class strings and apply them to all the elements in the matched set:

.classlist(  [ "foo", "bar", "baz" ] ) 
Set classes on elements with an array of strings, returns the matched set
    
    $('#mydiv').classlist([ "foo", "bar", "baz", "quux" ])
    
    > [ div#mydiv ]