JSFiddle - React, Tailwind, and code Playground
HTML
<p id="autoParagraph">
Jack Ü a également joué au Ultra Music Festival en 2015 avec l'ensemble du "Jack Ü crew", avec contributions en direct
de
<a target="_blank" href="https://en.wikipedia.org/wiki/CL_(singer)">CL</a>, ||
<a target="_blank" href="https://en.wikipedia.org/wiki/Kai_(Alessia_De_Gasperis_Brigante)">Kai</a>,
<a target="_blank" href="https://en.wikipedia.org/wiki/Sean_Combs">Diddy</a>,
<a target="_blank" href="https://en.wikipedia.org/wiki/Kiesza">Kiesza</a>,
et
<a target="_blank" href="https://en.wikipedia.org/wiki/Justin_Bieber">Justin Bieber</a>.
<span class="blink"></span>
</p>
CSS
p{width:50%;text-align:right;}
span#typing {
width: 377.96875px;
white-space: nowrap;
overflow: hidden;
display: inline-block;
-webkit-animation: type 5s steps(70, end);
animation: type 5s steps(70, end);
}
@keyframes type{
from { width: 0; }
}
@-webkit-keyframes type{
from { width: 0; }
}
JavaScript
var element = document.getElementById("autoParagraph");
var paragraph = element.innerHTML;
var splitText = paragraph.split("||");
var typingText = document.createElement("SPAN");
typingText.setAttribute("id", "typing");
typingText.innerHTML = splitText[splitText.length - 1];
element.appendChild(typingText);