JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="topboxesmenu">
                        <li>
                              <a class="employers"><p>Employers</p></a> 
                        </li>
                        <li>
                              <a class="he"><p>Higher Education</p></a>
                        </li>
                        <li>
                                <a class="adults"><p>Adults</p></a>
                        </li>
                           <li>
                               <a class="schoolleavers"><p>School Leavers</p></a>
                        </li>
                    </ul>

CSS

ul#topboxesmenu {list-style:none;  position:relative; margin-bottom: 0;}
ul#topboxesmenu ul {margin-bottom: 0; margin-left: 0;}
ul#topboxesmenu li {margin-bottom: 0; margin-left: 0;margin-top: -31px; }
ul#topboxesmenu li p {font-size: 12px; line-height: 20px; margin-bottom: 0; margin-left: 0; text-transform: uppercase;  color:#fff; font-weight: 400; }
ul#topboxesmenu li a:hover {text-decoration: none!important;}
ul#topboxesmenu li a {cursor:pointer; text-align: center;  float:left;  width: 125px; margin-right: 0px;    padding-top:102px; background:#ff0000; margin-right:10px;       padding-bottom:22px;
transition:all 0.2s ease-in-out; 
-o-transition:all .2s ease-in-out; 
-moz-transition:all .2s ease-in-out; 
-webkit-transition:all .2s ease-in-out;    
-ms-transition:all .2s ease-in-out; 

 
 }

JavaScript

$(document).ready(function() {

    window.setInterval(function() {

      $("#topboxesmenu li a").each(function() {
        $(this).css("background", get_random_color());
    });
   }, 1000);
});

function get_random_color() {
    var letters = '0123456789ABCDEF'.split('');
    var color = '#';
    for (var i = 0; i < 6; i++ ) {
        color += letters[Math.round(Math.random() * 15)];
    }
    return color;
}