JavaScript show/hide tab

Question

What i want is hide all content first, then click one tab, the corresponding content shows (the tab becomes \'active\'), where click it again it will disappear. some of the

Answer 1

This should work:

$(function() {
    $('#nav div').hide();
    $('#nav div:first').show();
    $('#nav ul li:first').addClass('active');
    $('#nav ul li a').click(function(){
        var currentTab = $(this).attr('href');
        var vis = $(currentTab).is(':visible');
        $('#nav div').hide();
        $('#nav ul li').removeClass('active');
        $(this).parent().addClass('active');
        if(vis) {
            $(currentTab).hide();
        } else {
            $(currentTab).show();
        }
    });
});

you have to check if the current tab is visible before you hide it.

working: http://jsfiddle.net/tqhHA/