JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdn.rawgit.com/mdesantis/jquery.textfade/15724e92069ebc30ab965dfe0231e932da99d2f0/lib/jquery.textfade.js"></script>
<div id="container">
<div><span id="test01i"></span><span id="test01o"></span></div>
</div>
CSS
#container {
display: inline;
text-align: center;
}
#container div span {
font-size: 1em;
font-family: monospace;
white-space: pre;
display: inline-block;
margin: 1em;
padding: 1em;
}
JavaScript
$(document).ready(function() {
var text =
"0123456789\n"+
"0123456789\n"+
"0123456789\n"+
"0123456789\n"+
"0123456789\n"+
"0123456789\n"+
"0123456789\n"+
"0123456789\n"+
"0123456789\n"
var sequence =
[ 0, 10, 98, 88,
11, 1, 9, 21, 87, 97, 89, 77,
22, 12, 2, 8, 20, 32, 76, 86, 96, 90, 78, 66,
33, 23, 13, 3, 7, 19, 31, 43, 65, 75, 85, 95, 91, 79, 67, 55,
44, 34, 24, 14, 4, 6, 18, 30, 42, 54, 64, 74, 84, 94, 92, 80, 68, 56,
45, 35, 25, 15, 5, 17, 29, 41, 53, 63, 73, 83, 93, 81, 69, 57,
46, 36, 26, 16, 28, 40, 52, 62, 72, 82, 70, 58,
47, 37, 27, 39, 51, 61, 71, 59,
48, 38, 50, 60,
49 ]
$('#test01i').textFadeIn( { 'text': text, 'milliseconds': 50, 'sequence': sequence })
$('#test01o').textFadeOut({ 'text': text, 'milliseconds': 50, 'sequence': sequence })
})