has class function - vanilla JS. Check if element has specified class

has_class.js

// hasClass, takes two params: element and classname
function hasClass(el, cls) {
  return el.className && new RegExp("(\\s|^)" + cls + "(\\s|$)").test(el.className);
}


/* use like below */
// Check if an element has class "foo"
if (hasClass(element, "foo")) {

  // Show an alert message if it does
  alert("Element has the class!");
}

Using regex is a bit performance heavy for this simple task, which may easily end up being used many times in loops! What's wrong with return el.className.indexOf(cls) != -1;?

Billy, I think that wouldn't work on <span class="foo-baz foo-bar">…</span> when cls is foo

I think this would work best

if (!el.className) {
    return false;
} else {
    var newElementClass = ' ' + el.className + ' ';
    var newClassName = ' ' + cls + ' ';
    return newElementClass.indexOf(newClassName) !== -1;
}

What about element.classList.includes(classToFind)?

You may need a polyfill for includes or:

element.classList.indexOf(classToFind) !== -1

Fez, I think that should be element.className.includes(classToFind) and you'd have to polyfill for IE. The second suggestion looks simpler, if you're not worried about the issue @ignacioiglesias mentioned.