Try this:
$('ul li a').click(function() {
var href = $(this).attr('href');
$(href).show();
$('div#MainAl div:not(' + href + ')').hide();
});
How this works: when a link inside a list is clicked, you get the
href
attribute from the clicked link. This href attribute is actually the selector for the div that you want to show. So, show this
div
, and hide all other
div
s inside
div#MainAl
.
Online demo:
http://jsfiddle.net/ProgramFOX/sGKsW/[
^]