javascript - how to switch b.w 2 sets of carousels each carousel set with multiples carousel images in materailize css using javascript?

Question

enter image description hereiam using 2 sets of carousels of 2 countries each set showing famous places of both countries .by default i want only 1 set of carousel to be displayed in my website (i.e Greece) but i have a button below carousel of Greece which says Explore Switzerland when i click this button carousel sets of Greece is replaced by carousel set of Switzerland

        <div class="carousel carousel-slider">
            <a class="carousel-item" href="#one!"><img src="images/greece1.png"></a>
            <a class="carousel-item" href="#two!"><img src="images/greece2.png"></a>
            <a class="carousel-item" href="#three!"><img src="images/greece3.png"></a>
        </div>


        <div class="row slider-gallery">
            <div class="col s12">
                <div class="col s3">
                    <h5 class="black-text">Peloponnese</h5>
                    <p class="black-text flow-text">Southern Greece </p>
                </div>
                <div class="col s3">
                    <h5 class="black-text">Famous for</h5>
                    <p class="black-text ">Two groups of islands lie off the Peloponnesian coast: the
                        Argo-Saronic Islands to the east, and the Ionian to the west. The island of Kythira, off
                        the
                    </p>
                </div>
                <div class="col s3 ">
                    <img src="images/component (16).png" alt="" class="thumbnail">
                </div>
                <div class="col s3 l2 black ">
                    <h4 class="white-text">Switzerland</h4>
                    <p class="white-text ">Two groups of islands lie off the Peloponnesian coast: the
                        Argo-Saronic Islands to the east.
                    </p>
                    <a class="waves-effect white btn-small right "> <i
                            class="material-icons black-text right ">send</i><span
                            class="black-text ">Explore</span>

                    </a>
                </div>
            </div>
        </div>

标签： javascriptjquerycsscarouselmaterialize