Initially hiding a div for later display

Try using visibility instead. Example:

$("#id2").click(function (e) {    $("#id1").css('visibility','hidden');    $("#id3").css('visibility','hidden');    $("#id2").css('visibility','visible');});

Both display and visibility can have an effect on browser behavior.

An alternative work-around to both is to set the opacity of the divs you want to hide to 0. That always works in my experience but is less elegant.

Update in reply to comment: In that case, you can set other properties like the width and height to 0px and the over-flow to hidden so that the divs don't occupy any space on screen. Ugly, but basic, and works.

<style>.hidden {    visibility: hidden;    overflow: hidden;    width: 0px;    height: 0px;}</style><div class="hidden"><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/f/fd/Aster_Tataricus.JPG/245px-Aster_Tataricus.JPG"/></div><div class="hidden"><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/a/a7/Chamomile%40original_size.jpg/280px-Chamomile%40original_size.jpg"/></div><div><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/a/a7/Jonquil_flowers06.jpg/320px-Jonquil_flowers06.jpg"/></div>

You can use the jQuery addClass and removeClass methods to make the divs visible and invisible, e.g.: $("#id1").removeClass("hidden"); and $("#id3").addClass("hidden");.

Why not use jQuery show and hide?

Hide the elements you want to hide (duh) on page load with CSS:

#id1, #id2, .. {    display: none;} 

Or you can hide it with Javacript:

$('#id1, #id2, ..').hide();

Show or hide them by using:

$('#btn2').click(function() {    $('#id1, #id3').hide();    $('#id2').show();});

Its best not to add display logic into your mark up a better way to do this would be

.hidden{ display:none;}

.

<div id="id1" class="stuff">TEXT, FORMS, and STUFF</div><div id="id2" class="stuff hidden" >TEXT, FORMS, and STUFF</div><div id="id3" class="stuff hidden">TEXT, FORMS, and STUFF</div>

.

$(".stuff").click(function () {    $(".stuff").addClass('hidden');    $(this).removeClass('hidden');});

Hope that helps if your still having rendering issues then maby try

.hidden{ visibility:hidden; }.stuff{display:block;}