JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://demos.flesler.com/jquery/scrollTo/js/jquery.scrollTo-min.js"></script>
<section>
                <article class="toggle-box" id="toggle1">
                    <aside class="info-rollover">
                        <h3>Locavores</h3>
                        <button class="more-btn">Show</button>
                    </aside>
                </article>
                <aside class="content">
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                </aside>
        </section>

<section>
                <article class="toggle-box" id="toggle2">
                    <aside class="info-rollover">
                        <h3>Locavores</h3>
                        <button class="more-btn">Show</button>
                    </aside>
                </article>
                <aside class="content">
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                </aside>
</section>

<section>
                <article class="toggle-box" id="toggle3">
                    <aside class="info-rollover">
                        <h3>Locavores</h3>
                        <button class="more-btn">Show</button>
                    </aside>
                </article>
                <aside class="content">
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
                    <div></div>
...

CSS

aside.content div {width:100%; height:200px; border:1px solid black;}

JavaScript

$(document).ready(function(){
    $(function(){
        $(".content").hide();
        $('.more-btn').click(function( e ){
            e.stopPropagation(); // to lower "DOM layers"
            
            $(this).closest('section').find('.content').show(500, 'swing'); 
            $('body').css('cursor','help');
            $.scrollTo($(this).closest('section'));
           //$(this).hide();
        });
    });
});