JSFiddle - React, Tailwind, and code Playground

HTML

<div class="rect"></div>
    <div class="rect"></div>

CSS

.rect{
        width:100px;
        height:100px;
        background:red;
        float:left;
        margin-left:20px;
        font-size:20px;
    }

.rect.active{
    background:blue;
}

JavaScript

$('html').click(function(){
        $('.rect').removeClass('active');
    });
    $('.rect').click(function(event){
        if($(this).hasClass('active')){
            $(this).removeClass('active');       
        } else {
            $(this).addClass('active');           
        }
        $('.rect').not($(this)).removeClass('active');
        event.stopPropagation();
    });