Skip to content
Related Articles
Open in App
Not now

Related Articles

How to check the given element has the specified class in JavaScript ?

Improve Article
Save Article
  • Difficulty Level : Medium
  • Last Updated : 10 Jan, 2023
Improve Article
Save Article

Sometimes we need to check the element has the class name ‘X’ ( Any specific name ). To check if the element contains a specific class name, we can use the contains method of the classList object.

Syntax:

element.classList.contains("class-name")

It returns a Boolean value. If the element contains the class name it returns true otherwise it returns false.

Implementation: Now let’s implement the given method. 

  • Here we will create a simple HTML page and add an h1 element having the class name main and id name main. Our task is to find that h1 contains the class name main.
  • Now create a script tag and write the javascript code. Create a variable named elem and store the h1 element by using document.getElementById( )
  • Now check if the element has the class name main and also checking if the class name myClass present or not.

Example : In this example, we will implement the above approach

HTML




<h1 id="main" class="main">Welcome To GFG</h1>
  
<script>
    let elem = document.getElementById("main");
      
    let isMainPresent = elem.classList.contains("main");
      
    if (isMainPresent) {
        console.log("Found the class name");
    } else {
        console.log("Not found the class name");
    }
      
    let isMyclassPresent = 
        elem.classList.contains("myClass")
      
    if (isMyclassPresent) {
        console.log("Found the class name");
    } else {
        console.log("Not found the class name");
    }
</script>

Output:

Found the class name
Not found the class name
My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!