Toggle a Class of an Element

To toggle a class of an element, you use the toggle() method of the classList property of the element.

element.classList.toggle(className);

If the element has the className, the toggle() method removes it. If the element doesn’t have the className, the toggle() method adds the className to the classList.

Suppose you have the following element:

<div class="show">Item</div>

The following illustrates how to toggle the show class of the <div> element:

const div = document.querySelector('div');
div.classList.toggle('show');

Source

https://www.javascripttutorial.net/toggle-a-class-of-an-element/