JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box1" style="background-color:#0000FF">
     <h3>This is a heading in a div element</h3>

    <p>This is some text in a div element.</p>
</div>
<div id="box2" style="background-color:red">
     <h3>This is a heading in a div element</h3>

    <p>This is some text in a div element.</p>
</div>
<input type="button" name="btn1" id="btn1" value="btn1">
<input type="button" name="btn2" id="btn2" value="btn2">

CSS

#box2 {
    display: none;
}

JavaScript

$('#btn1').click(function () {
    $("#box2").hide();
    $("#box1").show();
});

$('#btn2').click(function () {
    $("#box1").hide();
    $("#box2").show();
});