JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p><strong>Часы работы</strong>:</p>
<ul class="list-group">
  <li class="list-group-item calendarik"><b>Понедельник: </b>10:00 - 19:00</li>
  <li class="list-group-item calendarik"><b>Вторник: </b>10:00 - 19:00</li>
  <li class="list-group-item calendarik"><b>Среда: </b>10:00 - 19:00</li>
  <li class="list-group-item calendarik"><b>Четверг: </b>10:00 - 19:00</li>
  <li class="list-group-item calendarik"><b>Пятница: </b>10:00 - 19:00</li>
  <li class="list-group-item calendarik"><b>Суббота: </b>10:00 - 16:00</li>
  <li class="list-group-item calendarik"><b>Воскресение: </b> Выходной</li>
</ul>
<p>(<strong>без обеда</strong>)</p>

CSS

.calendarik { font: normal 18px "Arial", sans-serif; color: #555; }
.current { color: #07e; }
.rest { color: #fa0; }

.status {
  display: inline-block;
  width: 6.4em;
  padding: 0 1em;
  letter-spacing: 0px;
  font: bold 1em "Courier New", monospace;
  animation: pulse 1.8s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% { letter-spacing: 0px; text-align: left; }
  25%, 76% { letter-spacing: 0.3em; text-align: left; }
  26%, 75% { letter-spacing: 0.3em; text-align: right; }
  50% { letter-spacing: 0px; text-align: right; }
}

JavaScript

// Находим и обрабатываем выходные дни
$(".calendarik").each(function() {
  let oWorkingHours = $(this).contents().filter(function() {
    return this.nodeType === Node.TEXT_NODE;
  });
  let sRest = $(oWorkingHours).text();
  if (!sRest || !/[а-яё0-9-:]/gi.test(sRest)) {
    $(this).append("<span class='rest'>00:00 - 00:00</span>");
  } else if (/Выходной/gi.test(sRest)) {
    $(oWorkingHours).replaceWith("<span class='rest'>00:00 - 00:00</span>");
  } else if (sRest.match(/(\d+)/gi)[0] == sRest.match(/(\d+)/gi)[2]) {
    $(oWorkingHours).replaceWith("<span class='rest'>00:00 - 00:00</span>");
  }
});
// Получаем текущую дату и элемент с текущим днём недели
let oCurrDate = new Date();
let oCurrDay = $(".calendarik").eq(oCurrDate.getDay() == 0 ? 6 : oCurrDate.getDay() - 1);
// Парсим в тексте элемента часы работы текущего дня
let aCurrPartTime = oCurrDay.text().match(/(\d+)/gi).map(string => parseInt(string));
// Получаем предыдущую дату и элемент с предыдущим днём недели
let oYestDate = new Date();
oYestDate.setDate(oYestDate.getDate() - 1);
let oYestDay = $(".calendarik").eq(oYestDate.getDay() == 0 ? 6 : oYestDate.getDay() - 1);
// Парсим в тексте элемента часы работы предыдущего дня
let aYestPartTime = oYestDay.text().match(/(\d+)/gi).map(string => parseInt(string));
// Получаем текущий час
let nHour = oCurrDate.getHours();
// Создаём блок для надписи о статусе
let oStatus = $('<span class="status">');
// Функция добавления статуса
function fStatus(oParent, oChild, bOpen) {
  if (bOpen) { oChild.css("color", "green").html("ОТКРЫТО"); } 
  else { oChild.css("color", "red").html("ЗАКРЫТО"); }
  oParent.append(oChild);
}
//// Если текущий час попадает в рабочий промежуток, тогда
//// устанавливаем нужный текст с нужным цветом у нужного дня
if (aCurrPartTime[0] > aCurrPartTime[2]) { aCurrPartTime[2] += 24; }
if (aYestPartTime[0] > aYestPartTime[2]) {
  if (nHour < aYestPartTime[2]) {
    fStatus(oYestDay, oStatus, true);
  } else if (nHour >= aYestPartTime[2] &&...