JSFiddle - React, Tailwind, and code Playground

HTML

<div class="noactive">
    <div>No active</div>
    <div class="container">
        red<br />red<br />red<br />red<br />red<br />
        <div class="in">GREEN</div>
    </div>
</div>

CSS

.container:active,
.container_active
{
    background: red;
}
.container:active .in,
.container_active .in
{
    background: green;
}

JavaScript

$(document).ready(function(){
    $('.container .in').mousein(function(){
        $(this).addClass('container_active');
    }).mouseout(function(){
        $(this).removeClass('container_active');
    });
});