JSFiddle - React, Tailwind, and code Playground

HTML

<div>menu1</div>
<div>menu2</div>
<div>menu3</div>
<div>menu4</div>

CSS

.active
{
color:red;
}

.otherdeactive
{
    border-radius:8px;
    color:blue;
}
div
{
    border:1px solid #cccccc;
    float:left;
    width:100px;
    margin-left:10px;
}

JavaScript

jQuery(document).ready(function(){
    jQuery("div").hover(
       function(){
        jQuery(this).addClass("active");
        jQuery("div").not(".active").addClass("otherdeactive");
    },
    function(){ 
      jQuery(this).removeClass("active"); 
       jQuery("div").not(".active").removeClass("otherdeactive");
    });


});