Jquery for making DIV visible/invisible
jQuery's .show()
and .hide()
methodswill allow you to accomplish your goal.
$( 'your_selector' ).click( function() {
$( '#application_1' ).hide();
$( '#application_2' ).show();
});
Assuming the div elements already exist on the page and you are just toggling their visibility:
$('#Application1').click(function() {
$('#Application1Div').show();
$('#Application2Div').hide();
});
$('#Application2').click(function() {
$('#Application2Div').show();
$('#Application1Div').hide();
});
Here is a real basic example: http://jsfiddle.net/YBABG/1/
<div class="parentNode a1">Application 1
<div class="childNode">Information</div>
</div>
<div class="parentNode a2">Application 2
<div class="childNode">Information</div>
</div>
$(".childNode").hide();
$(".parentNode").click(function(){
$(".childNode").hide(100);
$(this).children().show(100);
});
Specifying a duration in hide will create a simple animated effect.
Here
improved DEMO
HAVE FUN & Happy coding!