JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <div class="links">
        <a id="Link1" href="#">Link1</a> 
        <a id="Link2" href="#">Link2</a>
        <a id="Link3" href="#">Link3</a> 
        <a id="Link4" href="#">Link4</a>
    </div>
    <div id="div1" class="ContentDivs">
        DIv1
    </div>
    <div id="div2" class="ContentDivs">
        Div2
    </div>
    <div id="div3" class="ContentDivs">
        Div3
    </div>
    <div id="div4" class="ContentDivs">
        Div4
    </div>
</div>
<script type="text/javascript">
        $(document).ready(function() {
              $("#div1").show().fadeIn("slow");
        });
        $('.links a').click(function() {
            $(".ContentDivs:visible").fadeOut("fast");//find current div here?
            $("#div" + ($(this).index()+1)).show().fadeIn("slow");
        });
    </script>

CSS

.ContentDivs
{
    width: 90%;
    height: 300px;
    border: solid 5px #404040;
    display:none;
}