JSFiddle - React, Tailwind, and code Playground

by ledlogic

HTML

<button class="btn btn-1">
button 1
</button>

<button class="btn btn-1">
button 2
</button>

<button class="btn btn-1">
button 3
</button>

<button class="btn btn-1">
button 4
</button>

CSS

.btn:hover {
  background-color: rgba(52, 152, 219,0.6);
}

.btn:focus {
  background-color: rgba(52, 152, 219,0.6);
}

.btn:active, .btn:visited {
  background-color: rgba(52, 152, 219,0.6);
}

.active {
  background: rgba(52, 152, 219,0.6); 
}

JavaScript

$(document).ready(function(){ 
    $('.btn').click(function() { 
        $(this).addClass('active');
    });
});