JSFiddle - React, Tailwind, and code Playground
HTML
<div class="btn">Button</div>
CSS
body {
background: #fff;
min-width: 100%;
min-height: 100%;
}
.btn {
width: 250px;
height: 60px;
line-height: 60px;
color: #fff;
background-color: red;
position: absolute;
text-align: center;
font-family: sans-serif;
text-transform: uppercase;
top: 50%;
left: 50%;
margin: -30px 0 0 -125px;
cursor: pointer;
}
.btn:hover {
background-color: orange;
}
.btn.active {
background-color: green;
}
.btn.active:hover {
background-color: blue;
}
JavaScript
$('.btn').on('click', function(){
$(this).toggleClass('active')
})