JSFiddle - React, Tailwind, and code Playground

HTML

<div class="row">
   <div class="col-12">
     <button type="button" class="btn active shadow-none" id="item-">item 1</button>
     <button type="button" id="item-2" class="btn shadow-none">item 2</button>
   </div>

   <div class="col-12">
     <button type="button" id="item-3" class="btn shadow-none">item 3</button>
     <button type="button" id="item-4" class="btn shadow-none">item 4</button>
   </div>
 </div>

CSS

.active {
  background-color: yellow;
}

JavaScript

$(document).ready(function () {
    $("button").on("click", function () {
        $(this).toggleClass('active').siblings().removeClass('active');
    });
});