JSFiddle - React, Tailwind, and code Playground

by marusia

HTML

<div class="logo">Logo</div>

CSS

.logo {
    padding: 10px;
    background: #000;
    text-align: center;
    font-size: 20px;
    color: #fff;
}

JavaScript

var ColorArray = [ '#eee', '#ddd', '#444'];
var ColorArrayIndex = 0;
$(".logo").hover(function() {
    $(this).animate({ backgroundColor: ColorArray[ColorArrayIndex]}, 400);
ColorArrayIndex++; if (ColorArrayIndex >= ColorArray.length) ColorArrayIndex = 0;},function() {});