Подскажите как обернуть в красный цвет каждую цифру в таймере? Спасибо
https://jsfiddle.net/s7p0yeam/7/
document.addEventListener('DOMContentLoaded', () => {
const newYear = new Date('Aug 22 2022 00:00:00');
const daysVal = document.querySelector('.time-count__days .time-count__val');
const hoursVal = document.querySelector('.time-count__hours .time-count__val');
const minutesVal = document.querySelector('.time-count__minutes .time-count__val');
function declOfNum(number, titles) {
let cases = [2, 0, 1, 1, 1, 2];
return titles[(number % 100 > 4 && number % 100 < 20) ? 2 : cases[(number % 10 < 5) ? number % 10 : 5]];
}
const timeCount = () => {
let now = new Date();
let leftUntil = newYear - now;
let days = Math.floor(leftUntil / 1000 / 60 / 60 / 24);
let hours = Math.floor(leftUntil / 1000 / 60 / 60) % 24;
let minutes = Math.floor(leftUntil / 1000 / 60) % 60;
daysVal.textContent = days;
hoursVal.textContent = hours;
minutesVal.textContent = minutes;
};
timeCount();
setInterval(timeCount, 1000);
});
.time-count__content{
display: flex;
}
.time-count__item{
margin: 0px 60px 0px 0px;
}
.time-count__val{
background: red;
color: #ffffff;
text-align: center;
font-size: 40px;
}
<div class="timer__time-count">
<h2 class="time-count__title">До окончания акции осталось:</h2>
<div class="time-count__content">
<div class="time-count__item time-count__days">
<div class="time-count__val">00</div>
<div class="time-count__text">дни</div>
</div>
<div class="time-count__item time-count__hours">
<div class="time-count__val">00</div>
<div class="time-count__text">часы</div>
</div>
<div class="time-count__item time-count__minutes">
<div class="time-count__val">00</div>
<div class="time-count__text">минуты</div>
</div>
</div>
</div>