JSFiddle - React, Tailwind, and code Playground

by maddesigns

HTML

<div id="div" class="foo bar">
</div>

<button id="button">toogle</button>

CSS

div {
    width: 100px;
    height: 100px;
}

.bar {
    background-color: red;
}

.foo {
    background-color: green;
}

JavaScript

Node.prototype.toggleClass = function(classname){
    this.className = this.className.indexOf(classname) === -1 ? this.className + " " + classname : this.className.replace(classname, "");
    return this;
}


document.getElementById('button').addEventListener('click', function(){
   document.getElementById('div').toggleClass('foo');
});