JSFiddle - React, Tailwind, and code Playground

HTML

<div class="block" id="pseudo-hover">Hover Me</div>

<div class="block" id="pseudo-highlight">Highlight Me</div>

CSS

body { background: #eaeaea; padding: 30px;}

.block {
    background: #fff; 
    border: 1px solid #ccc; 
    border-radius: 3px; 
    padding: 20px; 
    font-family: sans-serif; 
    font-size: 15px; 
    margin: 10px; 
    text-align: center;
    cursor: pointer;}

.highlight {
    background: #d6e4f6;
    border-color: #7387d2;
    color: #39446a;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;}

JavaScript

/* Pie Chart */
$('#pseudo-hover').hover( function() {
    $('#pseudo-highlight').toggleClass('highlight');
});