JSFiddle - React, Tailwind, and code Playground

HTML

<div id="time"></div>
    <div id="twoPoints">:</div>

CSS

#twoPoints{
    color:red;
    animation: tik-tok 1s infinite linear;
}
@keyframes tik-tok{
    0%{
        opacity: 0.1;
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0.1;
    }
}

JavaScript

function time() {
    var today = new Date();
    var hour = today.getHours();
    var minute = today.getMinutes();
    var second = today.getSeconds();
    var line = "&ndash;";
    var twoPoints = document.getElementById("twoPoints").textContent;

    if (hour < 10) {
        hour = "0" + hour;
    }
    if (minute < 10) {
        minute = "0" + minute;
    }
    if (second < 10) {
        second = "0" + second;
    }

    document.getElementById("time").innerHTML = (line + hour + twoPoints + minute + twoPoints + second + line);
     document.getElementById("twoPoints").innerHTML = document.getElementById("twoPoints").textContent; 
}
time();

setInterval(time, 1000);