JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.bitstorm.org/jquery/color-animation/jquery.animate-colors.js"></script>
<a href="#">button</a>

CSS

a {
    width: 120px;
    display: block;
    text-align: center;
    background: rgb(200,200,200);
    text-decoration: none;
    transition: all 1s ease;
}
.highlighted {
   background-color: rgb(0,0,0);
}

JavaScript

$(document).on("mouseenter", "a", function() {
		$(this).addClass("highlighted");
	});
$(document).on("mouseleave", "a", function() {
        $(this).removeClass("highlighted");
});