There is an element with id: one .

How to check the presence of a class: open-tab for this element?

 <div class="works-container"> <div class="row-tab" id="tabs"> <div class="tab-button open-tab" id="b_one"></div> <div class="tab-button" id="b_two"></div> <div class="tab-button" id="b_three"></div> <div class="tab-button" id="b_four"></div> </div> <div class="tabs open-tab" id="one"></div> <div class="tabs" id="two"></div> <div class="tabs" id="three"></div> <div class="tabs" id="four"></div> </div> 

    1 answer 1

    DOM elements have a classList property that returns a pseudo- classList . It has methods, and one of them is contains . It checks if the element has a class.

    Element.classList

    Description

    The classList property returns a DOMTokenList pseudo- array containing all the element classes.

    The classList has a primitive alternative - the className property, which contains the value of the element's class attribute.

    Methods

    ClassList is a getter. The object returned by it has several methods:

    add (String [, String])

    Adds the specified classes to the element.

    remove (String [, String])

    Removes the specified classes from the element.

    item (Number)

    The result is the same as calling classList [Number]

    toggle (String [, Boolean])

    If the element has no class, it adds, otherwise it removes. When the second parameter is false, removes the specified class, and if true, adds.

    If the second parameter is undefined or a variable with typeof == 'undefined', the behavior will be similar to passing only the first parameter when calling toggle.

    contains (String)

    Checks whether an item has a given class (returns true or false)

    And, of course, ClassList has a cherished length property that returns the number of classes for an element.

    Source : Element.classList

     console.log(document.getElementById("one").classList.contains("open-tab")); 
     <div class="works-container"> <div class="row-tab" id="tabs"> <div class="tab-button open-tab" id="b_one"></div> <div class="tab-button" id="b_two"></div> <div class="tab-button" id="b_three"></div> <div class="tab-button" id="b_four"></div> </div> <div class="tabs open-tab" id="one"></div> <div class="tabs" id="two"></div> <div class="tabs" id="three"></div> <div class="tabs" id="four"></div> </div>