How to show or hide tab based on the page url

Question

This is my code to flip around the tab and the contents under the tab:

$(function () {
    $(\'#tabs li a\').click(function (e) {
        e.preventDefault();
            


        

Answer 1

You can try to use multiple selectors for addClass() and removeClass() like,

$(function () {
    $('#tabs li a').click(function (e) {
        e.preventDefault();
        $('#tabs li, #content .current').removeClass('current');
        $(this).parent().addClass('current');
        var currentTab = $(this).attr('href');
        $(currentTab).addClass('current');
    });

    var homeTab = ["home1", "home2", "home3", "home4", "home5"];
    var recruitingTab = ["rec1", "rec2", "rec3", "rec4", "rec5"];
    var adminTab = ["adm1", "adm2", "adm3", "adm4"];

    var pathName = getPageName(window.location.pathname);
    //remove all current class from each tab
    $("#tHome,#tRecruiting,#tAdminControls,#home,#recruit,#admin").removeClass('current');
    if ($.inArray(pathName, homeTab) != -1) {
        //alert("at home tab");
        $("#tHome,#home").addClass('current'); // show home only
    }
    if ($.inArray(pathName, recruitingTab) != -1) {
        //alert("at recruiting tab");          
        $("#tRecruiting,#recruit").addClass('current'); // show recruiting tab only          
    }
    if ($.inArray(pathName, adminTab) != -1) {
        //alert("at admin tab");           
        $("#tAdminControls,#admin").addClass('current'); // show admin tab only
    }
});