Remove a CSS class with JavaScript

Call classList.remove() on the element:

const panel = document.querySelector('.panel');
panel.classList.remove('is-open');

It is safe to remove a class that is not present. Multiple names are allowed: panel.classList.remove('is-open', 'loading'). Use classList.toggle('is-open', shouldOpen) when the state is known, because it keeps add/remove logic together.

Check that the selector found an element before accessing it, especially when the script loads before the markup. Prefer a semantic class that represents state rather than changing inline styles in JavaScript. If a CSS transition should run, make sure the stylesheet defines the transition on the element in both states.

Sources

• MDN JavaScript reference