JSFiddle - React, Tailwind, and code Playground

HTML

<div id="capa" class="defecto">Esta es la capa</div><br><br>
<a id="enlacea" class="primero" href="">Efecto que se aplica al pasar el ratón</a><br>
<a id="enlaceb" class="segundo" href="">Efecto que se aplica al pasar el ratón</a>

CSS

.defecto{
  padding:15px;
}
.primera{
  color:#ff0080;
  background-color:#ffc6e2
}
.segunda{
  color:#00df00;
  background-color:#004040
}

JavaScript

$(function(){
		$("a").hover(function(){
    	var id = $(this).attr('id');
      if(id=="enlacea"){
      	$("#capa").removeClass("segunda");
        $("#capa").addClass("primera");
      }else{
      	$("#capa").removeClass("primera");
        $("#capa").addClass("segunda");
      }
    })
    
    
    $("a").mouseleave(function(){
    	$("#capa").removeClass("segunda");
      $("#capa").removeClass("primera");
    })
})