What is the best way to check if element has a class?

Question

The problem

If the element has multiple classes then it will not match with the regular property value checking, so I'm looking for the best way to check if the object has a particular class in the element's className property.

Example

// element's classname is 'hello world helloworld'
var element = document.getElementById('element');

// this obviously fails
if(element.className == 'hello'){ ... }

// this is not good if the className is just 'helloworld' because it will match
if(element.className.indexOf('hello') != -1){ ... }  

So what would be the best way to do this?

just pure javascript please

Answer 1

function hasClass( elem, klass ) {
     return (" " + elem.className + " " ).indexOf( " "+klass+" " ) > -1;
}

Answer 2

In modern browsers, you can use classList:

if (element.classList.contains("hello")) {
   // do something
}  

In the browser that doesn't implement classList but exposes the DOM's prototype, you can use the shim showed in the link.

Otherwise, you can use the same shim's code to have a generic function without manipulate the prototype.