JSFiddle - React, Tailwind, and code Playground

HTML

<div class="respuesta1" id="div1">1</div>
<div class="respuesta1" id="div2">2</div>
<div class="respuesta1" id="div3">3</div>
<div class="respuesta1" id="div4">4</div>

CSS

.respuesta1
{
width:30px;
height:30px;
border:1px solid;     
}
.respuestahover{
    background-color:#f00;
    opacity:0.2;
}

.respuestab{
        background-color:#f00;
    opacity:0.5;
    
}

JavaScript

//vars
var prendido1=false;
var prendido2=false;
var prendido3=false;
var prendido4=false;

//hover stuff
$(".respuesta1").hover(
    function (){
        $(this).addClass("respuestahover");									
                 }, 
	function () {
        $(this).removeClass("respuestahover");		
				});
//click stuff for div1
$("#div1").on("click",function(){
    //if my div isnt ON, then turn it on	
    if(prendido1==false)
    {
        $(this).toggleClass("respuestab");
        prendido1=true;
        //if any other is ON, turn them off.
        if(prendido2==true){
           $("#div2").toggleClass("respuestab");
           prendido2=false;}
        if(prendido3==true){
           $("#div3").toggleClass("respuestab");
           prendido3=false;}
        if(prendido4==true){
           $("#div4").toggleClass("respuestab");
           prendido4=false;}
    }
    else{//if is already ON, turn OFF
        $(this).toggleClass("respuestab");
        prendido1=false;}
							  });


//click stuff for div2
$("#div2").on("click",function(){
    //if my div isnt ON, then turn it on
    if(prendido2==false)
    {
        $(this).toggleClass("respuestab");
        prendido2=true;
        //if any other is ON, turn them off.
        if(prendido1==true){
           $("#div1").toggleClass("respuestab");
           prendido1=false;}
        if(prendido3==true){
           $("#div3").toggleClass("respuestab");
           prendido3=false;}
        if(prendido4==true){
           $("#div4").toggleClass("respuestab");
           prendido4=false;}
    } 	    
    else{//if is already ON, turn OFF
        $(this).toggleClass("respuestab");
        prendido2=false;}
							  });


//click stuff for div3
$("#div3").on("click",function(){
    //if my div isnt ON, then turn it on
    if(prendido3==false){
        $(this).toggleClass("respuestab");
        prendido3=true;
        //if any other is ON, turn them off.
        if(prendido1==true){
           $("#div1").toggleClass("respuestab");
   ...