JS/jQuery (Hide div, show div on click)

Question

I have two buttons.

I have two divs I want to show.

Each divs have different content.

I want both divs to only take up the same amount of space on the page.

I want it so on page load, div1 is shown, and if they click link div2, div1 disappears and div2 appears in its place.

What is the best way to go about doing this? and how?

Answer 1

All the initial CSS and onload stuff aside and you're using jquery, I think you're looking for something like

$("#button2").click(function(){
    $("#div1").hide();
    $("#div2").show();
})