JSFiddle - React, Tailwind, and code Playground

by tcloninger

HTML

<div id="page1" class="page">Page 1</div>
<div id="page2" class="page">Page 2</div>
<div id="page3" class="page">Page 3</div>

<div class="link" data-show="#page2"><a href="#">Click to show page 2</a></div>
<div class="link" data-show="#page3"><a href="#">Click to show page 3</a></div>

CSS

#page1{ display:block; }
.page{ display:none; }

JavaScript

$('.link').on('click', function(e) {

    /* Show the appropriate page */
    $('.page').hide();
    $( $(this).data('show') ).show();

    /* Show the appropriate links */
    $('.link').show();
    $(this).hide();
    
    e.preventDefault();

});