JSFiddle - React, Tailwind, and code Playground

HTML

<link href='http://fonts.googleapis.com/css?family=Quintessential' rel='stylesheet' type='text/css'>
    
    <div class="container-info">&nbsp;</div>

CSS

body, html{
    font-family: 'Quintessential', cursive;
}

.container-info{
    font-size: 16px;
    line-height: 20px;
    padding: 16px 10px 10px 92px;
    background-color: #fff;
    background-image: -webkit-linear-gradient(0deg, transparent 79px, #abced4 79px, #abced4 81px, transparent 81px), -webkit-linear-gradient(#eee .1em, transparent .1em);
    background-size: 100% 1.2em;
    background-color: #fff;
    background-image: -webkit-linear-gradient(0deg, transparent 79px, #abced4 79px, #abced4 81px, transparent 81px), -webkit-linear-gradient(#eee .1em, transparent .1em);
    background-size: 100% 1.2em;
}

.elementText{
    display: none;
}

JavaScript

$(document).ready(function(){
    var myInfo = {
        name: "Fábio Carreto", 
        country: "Portugal", 
        work: "Web Development/Mobile Development",
        languages_technologies: "PHP, Javascript, Java, Python, C, C++, C#, jQuery, .NET, SQL, MySQL, SQLite, Joomla, Umbraco, Drupal, Facebook, Google Maps and You Tube API's, Android Development Tools (ADT), HTML5, CSS3, Bootstrap",
        hobbies: "play soccer, read about new technologies, listen to music, play some sport, travel"
    };
    
    var phrasePrefix = ["My name is ",
                        ", I'm from ",
                        " and I work in ",
                        ".<br /><br />My favourite languages/technologies are ",
                        ".<br /><br />In my spare time I like to ",
                        "... :)"];
    var indexPhrase = 0;
    
    $.each(myInfo, function(index, value){
        var lineText = phrasePrefix[indexPhrase]+value;
        setTimeout(function(){
            showText(lineText)
        }, 2000*indexPhrase);
        
        indexPhrase++;
    });
    
    var lineText = phrasePrefix[indexPhrase];
    setTimeout(function(){
        showText(lineText)
    }, 2000*indexPhrase);
    
});


function showText(text){
    $(".container-info").append("<span class='elementText'>"+text+"</span>");
    $(".elementText").last().fadeIn("slow");
}