Bootstrap tab is not opening from the URL

I have this website: http://futura-dev.totalcommit.com

you can see that on the first menu item -> I have few sub menus.

Now, if you click on any sub menu it's should open a cooresponding bootstrap tab but it's not opening. Every time ti's open the first tab

but again if you select any sub menu then it's opening corresponding tab.

I am using following js file :

window.addEventListener
(
    'popstate',
    function( event )
    {
        tab_change();
    }
);

function tab_change()
{
    var hash = window.location.hash;
    hash && $( 'ul.nav a[href="' + hash + '"]' ).tab( 'show' );

    $( '.tab-link' ).click
    (
        function( e )
        {
            $( this ).tab( 'show' );
            $( this ).addclass('active');  

            var scrollmem = $( 'body' ).scrollTop() || $( 'html' ).scrollTop();
            window.location.hash = this.hash;
            $( 'html,body' ).scrollTop( scrollmem );

            $( 'ul.nav-tabs a[href="' + window.location.hash + '"]' ).tab( 'show' );
            $( 'ul.nav-tabs a[href="' + window.location.hash + '"]' ).addclass('active');            
        }
    );
}

do you know why and how can I solve it?

I want:

From any location of this website I want to open corresponding tab when I click on the sub menus as # is already added for the bootstrap tab.