Как получить текущее время и сравнить с тем что у меня в ul?

Выводиться на сайте список программ, как подчеркнуть текущую программу, которая идет в эфире?

<ul class="tvprog">
  <li>
    <span class="canals-time">07:00</span> <span class="canals-program">Օրախնդիր</span>
  </li>
  <li>
    <span class="canals-time">07:40</span> <span class="canals-program">Ուղիղ խոսք</span>
  </li>
  <li>
    <span class="canals-time">08:00</span> <span class="canals-program">Հարցազրույց</span>
  </li>
  <li>
    <span class="canals-time">08:30</span> <span class="canals-program">Ռեպորտաժներ</span>
  </li>
  <li>
    <span class="canals-time">09:00</span> <span class="canals-program">Pressnig ՍԱԹԻԿ ՍԵՅՐԱՆՅԱՆԻ ՀԵՏ</span>
  </li>
  <li>
    <span class="canals-time">09:40</span> <span class="canals-program">Լուրեր Ոստիկանությունից</span>
  </li>
  <li>
    <span class="canals-time">09:50</span> <span class="canals-program">Լուրեր (Մարզերից)</span>
  </li>
</ul>

Ответы (1 шт):

Автор решения: CbIPoK2513

Вот такой вариант

let time = [], // Создаём массив
    cur_time = new Date(); // Получаем текущее время
    
cur_time = (cur_time.getHours()*3.6e+6) + (cur_time.getMinutes()*60000); // Переводим часы и минуты в миллисекунды

$('.tvprog > li').each(function(){ // Проходим по всем елементам с временем
  let t = $(this).find('.canals-time').text().split(':'); // Получаем время
  t[0] = Number(t[0]); // Переводим в число
  t[1] = Number(t[1]); // Переводим в число
  t = (t[0]*3.6e+6) + (t[1]*60000); // Переводим в миллисекунды
  time.push(t); // Добавляем в массив
});

let time_index; // Создаём переменную
for(let i = 0; i < time.length; i++) { // Проходим циклом по массиву
  if(cur_time > time[i] && cur_time < (time[i+1] ? time[i+1] : 8.64e+7)) { // Если текущее время больше указанного и меньше следующего в массиве, то..
    time_index = i; // .. в переменную назначаем индекс массива
    break; // Останавливаем массив
  }
}

$('.tvprog > li').eq(time_index).css('color', 'green'); // Находим элемент по массиву.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="tvprog">
  <li>
    <span class="canals-time">07:00</span>
    <span class="canals-program">Օրախնդիր</span>
  </li>
  <li>
    <span class="canals-time">07:40</span>
    <span class="canals-program">Ուղիղ խոսք</span>
  </li>
  <li>
    <span class="canals-time">08:00</span>
    <span class="canals-program">Հարցազրույց</span>
  </li>
  <li>
    <span class="canals-time">08:30</span>
    <span class="canals-program">Ռեպորտաժներ</span>
  </li>
  <li>
    <span class="canals-time">09:00</span>
    <span class="canals-program">Pressnig ՍԱԹԻԿ ՍԵՅՐԱՆՅԱՆԻ ՀԵՏ</span>
  </li>
  <li>
    <span class="canals-time">09:40</span>
    <span class="canals-program">Լուրեր Ոստիկանությունից</span>
  </li>
  <li>
    <span class="canals-time">09:50</span>
    <span class="canals-program">Լուրեր (Մարզերից)</span>
  </li>
</ul>

Вариант с автообновлением

let time = [];

$('.tvprog > li').each(function(){
  let t = $(this).find('.canals-time').text().split(':');
  t[0] = Number(t[0]);
  t[1] = Number(t[1]);
  t = (t[0]*3.6e+6) + (t[1]*60000);
  time.push(t);
});

function Update(method) {
  let t = new Date(), index,
  ct = (t.getHours()*3.6e+6) + (t.getMinutes()*60000);
  for(let i = 0; i < time.length; i++) {
    if(ct > time[i]
    && ct <= (time[i+1] ? time[i+1] : 8.64e+7)) {
      index = i;
      break;
    }
  }
  //
  let timeout = 60000;
  if(method === 'start') {
    timeout = t.getSeconds() !== 0 ? (60 - t.getSeconds() * 1000) : 60000;
  }
  setInterval(Update, timeout);
  //
  $('.tvprog').find('li.--active').removeClass('--active');
  $('.tvprog').find('li').eq(index).addClass('--active');
} Update('start');
.--active {
  color: green;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="tvprog">
  <li>
    <span class="canals-time">07:00</span>
    <span class="canals-program">Օրախնդիր</span>
  </li>
  <li>
    <span class="canals-time">07:40</span>
    <span class="canals-program">Ուղիղ խոսք</span>
  </li>
  <li>
    <span class="canals-time">08:00</span>
    <span class="canals-program">Հարցազրույց</span>
  </li>
  <li>
    <span class="canals-time">08:30</span>
    <span class="canals-program">Ռեպորտաժներ</span>
  </li>
  <li>
    <span class="canals-time">09:00</span>
    <span class="canals-program">Pressnig ՍԱԹԻԿ ՍԵՅՐԱՆՅԱՆԻ ՀԵՏ</span>
  </li>
  <li>
    <span class="canals-time">09:40</span>
    <span class="canals-program">Լուրեր Ոստիկանությունից</span>
  </li>
  <li>
    <span class="canals-time">09:50</span>
    <span class="canals-program">Լուրեր (Մարզերից)</span>
  </li>
  <li>
    <span class="canals-time">14:40</span>
    <span class="canals-program">12312</span>
  </li>
  <li>
    <span class="canals-time">14:42</span>
    <span class="canals-program">1231</span>
  </li>
  <li>
    <span class="canals-time">14:44</span>
    <span class="canals-program">1231</span>
  </li>
  
</ul>

→ Ссылка