JSFiddle - React, Tailwind, and code Playground

HTML

<input id="input" style="width: 200px" />
    <button id="arrange">Arrange Words (click here..)</button>

    <div class="output"></div>

CSS

h1
        {
            font-family: Arial, Helvetica, sans-serif;
            font-weight: bold;
            text-transform: uppercase;
            text-align: justify;
            font-size: 1.8em;
            display: block;
            width: 100%;
        }
        .word
        {
            display: inline-block;
            padding-right: 30px;
        }
        .word .char
        {
            color: red;
            position: relative;
            -moz-transition: all .5s linear;
            -webkit-transition: all .5s linear;
            -o-transition: all .5s linear;
            transition: all .5s linear;
        }
        .word .char.padd
        {
            color: blue;
            padding-left: 15px;
            padding-right: 15px;
        }

JavaScript

$("#input").val("word arrangement");

var timer;
$("#arrange").click(function () {
    var text = $("#input").val();
    var values = text.split(" ");
    var h1 = $(document.createElement("h1"));

    for (var i = 0; i < values.length; i++) {
        var div = $(document.createElement("div")).addClass("word");

        for (var j = 0; j < values[i].length; j++) {    
            var span = $(document.createElement("span"))
                            .addClass("char");
            span.html(values[i][j]);
            div.append(span);
        }
        h1.append(div);

        div.mouseenter(_mouseEnter).mouseleave(_mouseLeave);
    }
    $(".output").append(h1);
});

function _mouseEnter(e) {
    var _span = $(this).children(".char");
    var len = _span.length, count = 1;

    _span.eq(0).addClass("padd");
    clearInterval(timer);

    timer = setInterval(function () {
        _span.removeClass("padd");
        _span.eq(count).addClass("padd");
        count++;
        if (count == len) count = 0;
    }, 500);
}

function _mouseLeave(e) {
    clearInterval(timer);
    $(this).children("span").removeClass("padd");
}