How to remove a CSS class from an element using JavaScript

The remove() method of the classList property can be used to remove a CSS class from an HTML element.

Let us say you have the following <div> element:

<div class="pizza hot spicy potato">🍕</div>

To remove the spicy class from the above HTML element, you can do the following:

const div = document.querySelector('div');

div.classList.remove('spicy');

The remove() method also allows you to remove multiple CSS classes from an HTML element as shown below:

const div = document.querySelector('div');

div.classList.remove('pizza', 'potato');

The classList property works in modern browsers, and IE10 and above.

Take a look at this article to learn more about adding, removing, and toggling CSS classes in JavaScript.

✌️ Like this article? Follow me on Twitter and LinkedIn. You can also subscribe to RSS Feed.