How Can I Remove a Class from an HTML Element Using Pure JavaScript?

Element's Class Removal with Pure JavaScript

Removing classes from an element is a common task in web development, where JavaScript plays a crucial role. Here's how it's done without the use of jQuery:

The preferred and standardized method for class removal is through the classList property:

ELEMENT.classList.remove("CLASS_NAME");

This approach is widely supported by modern browsers. For instance:

remove.onclick = () => {
  const el = document.querySelector('#el');
  el.classList.remove("red");
};

Where:

• remove is the button that triggers the removal.
• el is the element whose class needs to be removed.
• red is the class name to be removed.

In this example, clicking the button will remove the "red" class from the element with the ID "el," changing its background color back to its default.

The above is the detailed content of How Can I Remove a Class from an HTML Element Using Pure JavaScript?. For more information, please follow other related articles on the PHP Chinese website!