JSFiddle - React, Tailwind, and code Playground

HTML

<div id="loop">
    <p></p>
</div>
<div id=time</div>

JavaScript

window.onload = function () {
    getGreeting();
};

for (var hours = 0; hours < 24; hours++) {

    document.getElementById("loop").innerHTML = document.getElementById("loop").innerHTML + "\n" + getGreeting(hours);
}


function getGreeting(hours) {
    var greetingText;
    if (hours >= 0 && hours < 12) {
        greetingText = "Good morning!";
    } else if (hours >= 12 && hours < 18) {
        greetingText = "Good afternoon!";
    } else if (hours >= 19 && hours < 22) {
        greetingText = "Good Evening!";
    } else if (hours >= 22 && hours < 24) {
        greetingText = "Good night";
    }
    return greetingText;
}