JSFiddle - React, Tailwind, and code Playground

by Rich Costello

HTML

<div style="width:50px;height:50px;" class="mute"></div>

CSS

.mute {
    background:gray
}
.on {
    background:green
}
.off {
    background:red
}

JavaScript

var classNames = ['mute', 'on', 'off'];
$('div').click(function () {
    $(this).toggleClass(function (i, className, b) {
        var index = (classNames.indexOf(className) + 1) % classNames.length;
        $(this).removeClass(className);
        return classNames[index];
    });
});