JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outerwrapper">
    <div class="hover"></div><div class="receiver"></div>
</div>
<br>
<div class="outerwrapper">
    <div class="hover"></div><div class="receiver"></div>
    <div class="hover"></div><div class="receiver"></div>
    <div class="hover"></div><div class="receiver"></div>
</div>

CSS

.hover {
    width: 50px;
    height: 50px;
    background-color: red;
}
.receiver {
    width: 50px;
    height: 50px;
    background-color: blue;
}

JavaScript

$(function(){
    $(".hover").hover(
    function(){
        $(this).siblings(".receiver").css("opacity", 0.5);    
    },
    function(){
        $(this).siblings(".receiver").css("opacity", 1);  
    }        
    );            
});