JSFiddle - React, Tailwind, and code Playground

by Marius Jopen

HTML

<div class="box" data-catid="1">data-catid=1</div>
<div class="box" data-catid="2">data-catid=2</div>

CSS

.red {
  background: red;
}

.blue {
  background: blue;
}

JavaScript

$( ".box" ).hover(
  function() {
  
  	$("body").removeClass("red");
    $("body").removeClass("blue");
    
    var category = $(this).attr("data-catid");
    
    if (category == 1) {
      $("body").addClass("red");
	  }
    
    if (category == 2) {
   		$("body").addClass("blue");
	  }
    
  }
);