JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/color/jquery.color.plus-names-2.1.2.min.js"></script>
<div id="test"></div>
<input type="button" value="Run" id="run" />
<div id="log"></div>

CSS

#test {
    background-color: #0000FF;
    height: 100px;
    width: 100px;
}
#log {
    height: 200px;
    overflow: auto;
}

JavaScript

jQuery(function ($) {
    var
    	cc,
    	colors = ['#FF0000', '#0000FF'];
    $('#run').click(function () {
        $('#log').empty();
        cc = !cc;
        $('#test').animate({backgroundColor: colors[cc ? 0 : 1]}, {
            duration: 800,
            step: function (now, tween) {
                var
                	d = new Date();
                $('#log').prepend($('<div />').text(
                	d.getSeconds() + '.' + d.getMilliseconds() + ': ' +
                    tween.now
                ));
            }
        });
    });
});