JSFiddle - React, Tailwind, and code Playground

HTML

<span class="darkmark">
  <em class="rnr">RR</em>
  <em class="apple">Apple Enthusiast</em>
  <em class="active glasses">Glasses Wearer</em>
  <em class="html5">HTML5 User</em>
  <em class="wine">Wine Drinker</em>
</span>

CSS

.active {color: red;}

JavaScript

function change_active() {
    var elements = $('.darkmark em');
    var count = elements.length;
    var active = $('.darkmark em.active');
    var next = (active.index() + 1) % count;
    active.removeClass('active');
    $(elements.get(next)).addClass('active');
}
setInterval(change_active, 5000);