JSFiddle - React, Tailwind, and code Playground

HTML

<p id='button_text'>
    <a id='buttons'>Buttons</a>
</p>

CSS

#button_text {
    padding: 20px;
    background: #aa0000;
}

#buttons {
    padding: 10px;
    background: #00aa00;
}

JavaScript

$("#button_text").mouseenter(function() {
    var randClass = 'randomClass' + Math.round(Math.random() * 50);
    console.log(randClass);
    $("#buttons").addClass(randClass);
    $("#buttons").data('randClassValue', randClass);
}).mouseleave(function() {
    var randClass = $("#buttons").data('randClassValue');
    $("#buttons").removeClass(randClass)
});