How do I display a greeting based on the time of day?

Markup

<h1>
  <span class="greeting"></span>
  <span class="greeting-2"></span>
</h1>

In these two spans, we will have the necessary information. We look. (don’t forget to include jQuery).

JS (jQuery)

let day = new Date();
let hour = day.getHours();
if (hour>=5 && hour<12) {
  $('h1 .greeting').text('Доброе');
  $('h1.greeting-2').text('утро');
} else if (hour>=0 && hour<5) {
  $('h1 .greeting').text('Доброй');
  $('h1 .greeting-2').text('ночи');
} else if (hour>=12 && hour<18) {
  $('h1 .greeting').text('Добрый');
  $('h1 .greeting-2').text('день');
} else if (hour>=18 && hour<24) {
  $('h1 .greeting').text('Добрый');
  $('h1 .greeting-2').text('вечер');
}

variable day stores the date after getHours we get the time of our system (that is, it will work everywhere, regardless of the time zone). And then we just make different conditions. Can be done through switchif you know how) It’s that simple) simple and works. Just in case, I will attach for you codepento make it more convenient.

Thank you all for being with me, successful application!