JSFiddle - React, Tailwind, and code Playground

by chinnayya

HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<body>
<p>Here is a message: <span id="message"></span></p>
</body>

JavaScript

function viewNextMsg() {
    if (messages.length == 0) {
        alert("Empty Array");
    } else {
        $('#message').html(messages.pop()).fadeIn(500).delay(1000).fadeOut(500, viewNextMsg);
    }
};

var messages = [
    "Message 1",
    "Message 2",
    "Message 3",
    "Message 4",
    "Message 5"
].reverse();

$('#message').hide();
viewNextMsg();