EN
JavaScript - remove class from HTML element on click event
0
points
In this article, we would like to show you how to remove class from the HTML element on click event using JavaScript.
Quick solution:
<div onclick="this.classList.remove('class-name')">Click me to remove 'class-name' class.</div>
Where:
class-nameis the name of the class that will be removed on click event.
Practical example
In this example, we create removeClass() function that accepts 2 arguments:
element- handle to the HTML element,clazz- class name to remove.
Using the removeClass() function remove background class from the div element.
// ONLINE-RUNNER:browser;
<!doctype html>
<html>
<head>
<style>
.background {
background: yellow;
}
.border {
border: 1px solid red;
}
</style>
</head>
<body>
<script>
function removeClass(element, clazz) {
element.classList.remove(clazz);
}
</script>
<div class="background border" onclick="removeClass(this, 'background')">Click me!</div>
</body>
</html>