JSFiddle - React, Tailwind, and code Playground

HTML

<div id="div1"><span></span>-free Recipes</div>

CSS

#div1{float:left;padding:20px;margin-top:40px;}

JavaScript

$(document).ready(function() {
  var items = [["Two",2000], ["Three",3000], ["Four",4000], ["Five",5000], ["Six",6000], ["One",1000]];
  var $text = $('#div1 span');

  function loop(index) {
    $text.html(items[index][0]);
    $text.fadeIn();
    $text.delay(items[index][1]).fadeOut(function(){
        if(index < (items.length - 1)){
            loop(++index);
        }
        else loop(0);
    });
  }

  loop(0);
});