JSFiddle - React, Tailwind, and code Playground

by Neo Aptt

HTML

<label>Step: <span id='step'></span>
</label>
<div id='results'></div>

JavaScript

var mary = '</br>\
Mary had a little lamb,</br>\
Little lamb, little lamb,</br>\
Mary had a little lamb,</br>\
Its fleece was white as snow</br>\
</br>\
And everywhere that Mary went,</br>\
Mary went, Mary went,</br>\
Everywhere that Mary went</br>\
The lamb was sure to go</br>\
</br>\
It followed her to school one day</br>\
School one day, school one day</br>\
It followed her to school one day</br>\
Which was against the rules.</br>\
</br></br>\
It made the children laugh and play,</br>\
Laugh and play, laugh and play,</br>\
It made the children laugh and play</br>\
To see a lamb at school\
';
var img = '<img src="http://i.stack.imgur.com/sHCba.png"/>'
function run() {
    var step = localStorage.getItem("step");
    step++;
    localStorage.setItem("step", step);
    $('#step').text(step);
    var r = $('#results')
    switch (step) {
        case 1:
            for(var i = 0; i < 133; i++){
            r.append(i+1+' ');
            }
            break;
        case 2:
            r.html(mary);
            break;
        case 3:
            r.html(img);
            localStorage.setItem("step", 0);
            break;
        default:
            localStorage.setItem("step", 0);
            break;
    }
}
run();