JavaScript Code

How to remove a classname for a div using JavaScript?

Tutorials using JS

Problem Statement

remove a classname from existing classnames of a div element using JavaScript


to remove a classname from the existing classnames of a div element using JavaScript, we can use Element.classList property. call remove() method on the classList property and pass the required classname as argument



when user clicks on the Click me button, we get the div element with the id myDiv, and remove the classname tile from the existing classnames using Element.classList.remove()

<!DOCTYPE html>
<h1>JavaScript Tutorial</h1>
<h2>Remove classname for a div</h2>
<button id="myBtn">Click me</button>
<div id="myDiv" class="card tile active">About</div><br>
<pre id="output"></pre>

document.getElementById("myBtn").addEventListener("click", function() {
    //get div element
    const myDiv = document.getElementById("myDiv");
    //remove classname of div
    document.getElementById("output").innerHTML = myDiv.classList;


Copyright @2022