JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#">CLICK ME</a>

<div class="caption-content">
    <p class="caption">1 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Natus a magni maiores perferendis itaque iure! Et itaque sunt cum cupiditate nesciunt aspernatur architecto doloribus provident nisi tenetur illo praesentium nobis.</p>
    <p class="caption">2 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus consequuntur deserunt unde beatae quia quis nobis asperiores perspiciatis cumque ut fugiat minus. Suscipit libero quaerat nam doloremque deleniti repudiandae est.</p>
    <p class="caption">3 Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus consequuntur deserunt unde beatae quia quis nobis asperiores perspiciatis cumque ut fugiat minus. Suscipit libero quaerat nam doloremque deleniti repudiandae est.</p>
</div>

CSS

.caption {
    display: none;
}

JavaScript

$('a').click(function () {
    var $firstCaption = $('.caption').first();
    $firstCaption.appendTo('.caption-content').siblings('.caption').finish().fadeOut().promise().done(function () {
        $firstCaption.fadeIn();
    });
});