JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="me" id="one"></div>
    <div class="me" id= "two"></div>
</div>

CSS

.me{
    float:left;
    margin-right:20px;
    width:100px;
    height:100px;
     background-color:blue;
}
 

.reduce{
    filter:alpha(opacity=50);
    opacity:0.80;
}

JavaScript

$(document).ready(function(){
    
  $(".wrapper div.me:last").addClass("reduce");
  $(".wrapper div.me").hover(
  function(){
     $(this).removeClass('reduce');
     $(".wrapper div").not(this).addClass('reduce');
     }); 
});