JSFiddle - React, Tailwind, and code Playground

by jfriend00

HTML

<li id="nav_about"><a href="">Loren ipsum <span id="adjective">1</span></a>
</li>

CSS

a {text-decoration: none;}
li {list-style-type: none;}

JavaScript

function cycle(cntr) {
    if (cntr > 4) { cntr = 1; }
    var o = $("#adjective");
    o.fadeOut(500)
        .queue(function(next) {o.text(cntr + ""); next();})
        .delay(100)
        .fadeIn(500, function() {cycle(++cntr);});
}
    
cycle(2);