JSFiddle - React, Tailwind, and code Playground

HTML

<div class="button ">My button</div>

CSS

.button { 
    float:left;
    color: #333;
    width: auto;
    text-align: center;
    padding: 0 10px;
    background: #f0f0f0;
    line-height: 1.5em;
    height: auto;
}
.button.active {
    background: #ea0000;
    color: #fff;
}

JavaScript

$('.button').click(function(){
    if($(this).hasClass('active')){
        $(this).removeClass('active')
    } else {
        $(this).addClass('active')
    }
});