JSFiddle - React, Tailwind, and code Playground

HTML

<!-- BEGIN: Container. -->
    <div style="width: 300px ; border: 1px solid black ; padding: 10px ;">
 
        Don't you want to
        <a href="#" class="readMore">Read More</a>
 
 
        <!-- BEGIN: Hidden Content. -->
        <div class="content" style="display: none ; width: 300px">
 
            This is where the additional content will go - the
            content that the user can see when the Read More
            link is clicked. We're going to use jQuery to slide
            the content of this container into view, with a slow
            transition. This is where the additional content will go
            - the content that the user can see when the Read More
            link is clicked. We're going to use jQuery to slide
            the content of this container into view, with a slow
            transition. This is where the additional content will go
            - the content that the user can see when the Read More
            link is clicked. We're going to use jQuery to slide
            the content of this container into view, with a slow
            transition. This is where the additional content will go
            - the content that the user can see when the Read More
            link is clicked. We're going to use jQuery to slide
            the content of this container into view, with a slow
            transition.
 
        </div>
        <!-- END: Hidden Content. -->
 
 
    </div>
    <!-- END: Container. -->
    <!-- BEGIN: Container. -->
    <div style="width: 300px ; border: 1px solid black ; padding: 10px ;">
 
        Don't you want to
        <a href="#" class="readMore">Read More</a>
 
 
        <!-- BEGIN: Hidden Content. -->
        <div class="content" style="display: none ; width: 300px">
 
            This is where the additional content will go - the
            content that the user can see when the Read More
            link is clicked. We're going to use jQuery to slide
            the content of this container into...

JavaScript

// Bind to the Read More link to toggle the
        $( "a.readMore" ).click(
            function( event ){
                // Cancel the default event (this isn't a real link).
                event.preventDefault();
                var hiddenContent = $(this).next("div.content"); 
 
                // Check to see if the content is visible.
                if (hiddenContent.is( ":visible" )){
 
                    // Hide it slowly.
                    hiddenContent.slideUp( 3000 );
 
                } else {
 
                    // Show it slowly.
                    hiddenContent.slideDown( 3000 );
 
                }
 
            }
        );