JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://raw.github.com/jquery/jquery-color/master/jquery.color.js"></script>
<div id="toggle"></div>

CSS

#toggle {
    position: absolute;
    width: 100px; height: 100px;
    top: 20px; left: 20px;
    background-color: #FF0000;
}

JavaScript

$('#toggle').mouseenter(function(){          
    $('#toggle').stop().animate({ backgroundColor: '#FF00FF' }, 500);
}).mouseleave(function() {
    $('#toggle').stop().animate({ backgroundColor: '#FF0000' }, 500);
});