JSFiddle - React, Tailwind, and code Playground

by kybernaut

HTML

<article id="post-5" class="post-5 page type-page status-publish hentry" style="overflow: hidden; width: auto; height: 400px;">
    <div class="col-6 column">
        
        <p><strong>Je <u>mi přes <em>40</em> a jsem</u> žena.</strong></p>
        <p><strong>Snažila jsem se zařadit, zmoudřet a mít klid. Nepodařilo se.</strong></p>
        <p style="text-align: justify;">Teď se už předělávat nehodlám. A víte co? Strašně si to užívám. Prozkoumávám svou zběsilost v srdci, ženskou marnivost i potřebu mít věci pod kontrolou. Zjistila jsem, že svět je báječné místo k žití, že život není vždycky fér, ale c´est la vie, že být sexy neznamená být krásná, že být úspěšná, neznamená být chytrá, že když se člověk nebere smrtelně vážně, tak je to vlastně skvělá jízda a že můj “bucketlist” je zatraceně dlouhý. Také, že když se nám “povedou” děti, věříme na geny, ale když jsou děti svérázné a my čelíme neustále zvednutému obočí okolí a máme pocit selhání – je lepší nechat to být a doufat, že se dobré geny nakonec “proberou”, protože to jediné, na čem opravdu záleží, jsou hodnoty a důvěra v sebe i svět okolo nás, neopomíjet tu krásu a čistotu, která dětství provází, tu lásku, kterou jsme schopni získat i dávat a užít si čas, který nám byl dán. Svět je plný silných příběhů a skvělých lidí a já jsem se rozhodla, že v čase, který mi byl vyměřen, je chci potkávat, chci se jimi inspirovat a tuto inspiraci předávat dál.</p>
        
    </div>
</article>

JavaScript

function renderChild(el){
    $(el).contents().each(function(){
        if(this.nodeType !== 3){
            renderChild(this);
        }else{
            $(this).replaceWith(
                '<span class="fade">'+$(this).text().split('').join('</span><span class="fade">')+'</span>'
            );
            $('.fade').hide().each(function(i){
                $(this).delay(i*30).fadeIn(function(){
                    $(this).contents().unwrap();
                });
            });
        }
    });
}
renderChild('.post-5 div p');