WebApp div show hide

by Denise Nepraunig

HTML

<div id="nav">Navigation<br>
    <button id="mainbtn">Main Content</button><br>
    <button id="secondbtn">Second Content</button>
</div>
<div id="main" class="content">Main content</div>
<div id="second" class="content">Second content</div>

CSS

#nav {
    background-color: yellow;
    float: left;
    width: 25%;
}
.content {
    background-color: teal;
}

JavaScript

$("#second").hide();

$("#mainbtn").click(function() {
    //alert("Hello");
    $("#main").show();
    $("#second").hide();
});

$("#secondbtn").click(function() {
    //alert("Hello");
    $("#second").show();
    $("#main").hide();
});