<h1><span class="greeting"></span> <span class="greeting-2"></span>, дорогой пользователь</h1>
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('вечер');
  }

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js