JSFiddle - React, Tailwind, and code Playground

by suncannon

HTML

<div id="mytoggle"> Click me! </div>

CSS

#mytoggle {
    padding:20px;
    font-size:17pt;
    font-family:gill sans;
    text-align:center;
    cursor:pointer;
    border:solid 2px #333;
    user-select:none;
    -webkit-user-select:none;
    -moz-user-select:none;
}

JavaScript

var on = false;

function toggleIt() {
    if (on==false) {
        var d = document.getElementById("mytoggle") 
        d.style.backgroundColor = "#0af" 
        on = true
    } else {
        var d = document.getElementById("mytoggle") 
        d.style.backgroundColor = "#fff" 
        on = false
    }
}

var d = document.getElementById("mytoggle"); d.addEventListener("click",toggleIt);