How to tell if an HTML element has a particular class in JavaScript? [duplicate]

Question

Is there an easy way to tell if an HTML element has a specific class? For example:

var element = document.getElementById('something');
if (element.class == 'car')

Of course an element can have multiple classes, so maybe the if statement would have to be of the following form?

if (element.class.includes('car'))

Answer 1

var element = document.getElementById("myid");
if (element.classList.contains("myclass")) { /* do stuff */ }

Read more on element#classList here: https://developer.mozilla.org/en-US/docs/DOM/element.classList

This link also contains a polyfill for older browsers.

Answer 2

If using jQuery is an option you can use hasClass() see http://api.jquery.com/hasClass/

If not you can take a look at pure JS implementation - Test if an element contains a class?

Answer 3

For strange reasons the name of the member containing the class(es) is className, not class. Multiple class names are separated by space.

Answer 4

You need to use:

 class = document.getElementById("{id_of_element").getAttribute("class");

then

 String[] vals = class.split(" ");
 var match = false;
 for (i = 0; i < vals.length;i++) {
   if (vals[i].equalsIgnoreCase('car') {
     match = true;
     break;
   }
 }

 if (match) {
  //do something
 }

HTH.