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;
}

JavaScript

$(document).on("mouseenter", "a", function() {
		$(this).animate({
			"background-color": "rgb(0,0,0)"
		});
	});
$(document).on("mouseleave", "a", function() {
		$(this).animate({
			"background-color": "rgb(200,200,200)"
		});
});