JSFiddle - React, Tailwind, and code Playground

HTML

<div class="brand">
<div>O<span class="full">wen </span>W<span class="full">illiams</span></div>
</div>

CSS

.brand{
    background-color:cyan;
    font-size: 16pt;
    width:36px;
}

.full{
    display: none;
}

JavaScript

$('.brand').hover(function(){
    $(this).animate({width: '330px'},'slow',function(){
        $(this).children('div').children('.full').stop().fadeIn('slow');
    }); 
},function(){
    $(this).children('div').children('.full').stop().fadeOut('slow',function(){
        $(this).parent().parent().stop().animate({width: '36px'},'slow');
    });
});