JSFiddle - React, Tailwind, and code Playground

HTML

<div><span id="black">LOGO</span><span id="red">LOGO</span></div>

CSS

#black{
    color:black;
    font-weight:bold;
    font-size:2em;
}
#red {
    position:absolute;
    z-index:10;
    left:8px;
    width:0px;
    overflow:hidden;
    font-weight:bold;
    font-size:2em;
    color:red;
}

JavaScript

var red = document.getElementById('red');
var black = document.getElementById('black');
red.style.width = "0px";
var animation = setInterval(function(){
    console.log(red.style.width);
    if(red.style.width == "91px")
        clearInterval(animation);
    red.style.width = parseInt(red.style.width,10)+1 +"px";
},50);