JSFiddle - React, Tailwind, and code Playground

by iamanubhavsaini

HTML

<div id="menu">
<span data-id="d1">link</span>
<span data-id="d2"> link</span>
</div>

<div id="container">
    <div id="d1">1</div>
        <div id="d2">2</div>
    </div>

CSS

div div{margin: 20px; height: 100px; width: 100px; display:none;}
span{
    padding: 10px;
    cursor: pointer;
    background-color: #aaa;
}

JavaScript

$(function() {
    $('span').on('click', function() {
        var Id = $(this).attr('data-id');

        $('#' + Id).css({
            'display': 'block'
        });

        $('#' + Id).siblings().css({
            'display': 'none'
        });
    });
});