JSFiddle - React, Tailwind, and code Playground

HTML

<h2>Eat, Sleep, Work</h2>
<ul>
</ul>

JavaScript

eat(daytime);
//eat(work);
//sleep(day);
//work();
function daytime(){
 sleep(work);
}

/******************************************************************
No need to change anything below this line
*******************************************************************/
function eat(callback){
    asyncPrint('eat', callback);
}

function sleep(callback){
     asyncPrint('sleep', callback);   
}

function work(callback){
     asyncPrint('work', callback);   
}

function asyncPrint(msg, callback){
    randomAsync(function(){
        print(msg);
        if(callback) callback();
    });
}

function print(msg){
    var li = document.createElement('li');
    li.innerHTML = msg;
    document.querySelector('ul').appendChild(li);
}

function randomAsync(callback){
    var timeout = Math.round(Math.random() * 100);
    setTimeout(callback, timeout);
}