Hash / achor url должен отображать скрытый div jquery / css

эта проблема сводила меня с ума, хотя я уверен, что ответ смотрит мне в лицо, потому что я часто идиот.

Я сделал вкладку на основе этого кода, который использует как CSS, так и jQuery. http://www.mkyong.com/jquery/how-to-use-css-and-jquery-to-hide-and-show-tab-content/

Содержимое с вкладками также должно быть доступно через раскрывающееся меню CSS. Вы можете видеть это здесь. http://jsfiddle.net/4N63A/

Это код, который я использую.

$('.subSection-tabs > li > a').click(function(event){
event.preventDefault();//stop browser to take action for clicked anchor

//get displaying tab content jQuery selector
var active_tab_selector = $('.subSection-tabs > li.selected > a').attr('href');                 
//find actived navigation and remove 'selected' css
var actived_nav = $('.subSection-tabs > li.selected');
actived_nav.removeClass('selected');

//add 'selected' css into clicked navigation
$(this).parents('li').addClass('selected');

//hide displaying tab content
$(active_tab_selector).removeClass('selected');
$(active_tab_selector).addClass('hide');

//show target tab content
var target_tab_selector = $(this).attr('href');
$(target_tab_selector).removeClass('hide');
$(target_tab_selector).addClass('selected');
 });

//checks for hash tag in URL to display correct div 
var hash = $.trim( window.location.hash );
if (hash) $('.subSection-tabs > li > a[href$="'+hash+'"]').trigger('click');

//force browser URL to update with the selected hash tag
$("a[href^=#]").on("click", function(e) {
    e.preventDefault();
    history.pushState({}, "", this.href);
    //show/hide div from drop down
    var active_nav_selector = $('ul > li.navHash > a').attr('href');
    $(active_nav_selector).removeClass('selected');
    $(active_nav_selector).addClass('hide');
    var target_nav_selector = $(this).attr('href');
    $(target_nav_selector).removeClass('hide');
    $(target_nav_selector).addClass('selected');
});

Поэтому, когда пользователь нажимает ссылку "Разбивка", а затем "Tab 2", URL-адрес браузера изменяется на # tab2, но вкладка 2 div и содержимое не отображаются. Изменение его с вкладки "Показать вкладку 2" работает так, как ожидалось, и помещает соответствующий хэш (# tab2) в окно браузера. Мне нужно, чтобы выпадающие ссылки навигации работали правильно, чтобы пользователи могли использовать кнопку "Назад". Вы можете нажать на ссылку Google, чтобы узнать, что я имею в виду.

О, боже, надеюсь, я объясню это правильно. В принципе, выпадающее меню должно также показывать и скрывать правильные div. Мой скрипт можно просмотреть в /script.js

Большое спасибо заранее. Я очень ценю любую помощь, потому что я схожу с ума. Если бы я мог испечь тебе кексы, я бы это сделал. Я делаю потрясающие мохито. Вы можете притворяться, что ели их.

UPDATE: я добавил функцию show/hide class к моей функции Jsfiddle (e), и теперь выпадающий показывает правильный div, но не скрывает предыдущее. Я так близко, но пока!