сохранить выбор вкладки при перезагрузке страницы javascript

Question

Я хочу сохранить выбор вкладки на javascript. Когда пользователь нажимает на вкладку, выбор не изменяется после обновления страницы пользователем. Я перепробовал много способов. Главным образом с этим https://www.tutorialrepublic.com/faq/how-to-keep-the-current-tab-active-on-page-reload-in-bootstrap.php

Но, похоже, ни один из них не работает.

Мой html здесь:

<nav class="cd-tabs__navigation">
    <ul class="cd-tabs__list" id="myTab">
        <li>
            <a href="#tab-dashboard" class="cd-tabs__item cd-tabs__item--selected" style="padding: 6px;">
                <img src="images/dashboard.png" width="50px" height="50px" style="padding: 6px;">
            </a>
        </li>
        <li>
            <a href="#tab-workhours" class="cd-tabs__item">
                <img src="/images/working-hours.png" width="50px" height="50px" style="padding: 6px;"/>
            </a>
        </li>

        <li>
            <a href="#tab-my-profile" class="cd-tabs__item">
                <img src="/images/user.png" width="50px" height="50px" style="padding: 6px;"/>
            </a>
        </li>

        <li>
            <a href="#tab-admin" class="cd-tabs__item">
                <img src="/images/settings.png" width="50px" height="50px" style="padding: 6px;"/>
            </a>
        </li>
        <li>
            <a href="#tab-company" class="cd-tabs__item">
                <img src="/images/company.png" width="50px" height="50px" style="padding: 6px;"/>
            </a>
        </li>
    </ul> <!-- cd-tabs__list -->
</nav>

<ul class="cd-tabs__panels">
    <li id="tab-dashboard" class="cd-tabs__panel cd-tabs__panel--selected text-component">
     <!-- some content -->
    </li>

    <li id="tab-workhours" class="cd-tabs__panel text-component">
        <!-- some content -->
    </li>

    <li id="tab-my-profile" class="cd-tabs__panel text-component">
        <!-- some content -->
    </li>

    <li id="tab-admin" class="cd-tabs__panel text-component">
        <!-- some content -->
    </li>


    <li id="tab-company" class="cd-tabs__panel text-component">
      <!-- some content -->
    </li>
</ul> <!-- cd-tabs__panels -->

Мой JS

$( '.cd-tabs__item' ).on( 'click', function(){
    window.location.hash = $(this).attr( 'id' );
});
// Check if we need to activate a tab based on the has
if ( window.location.hash && $( window.location.hash ).length ) {
    $( window.location.hash ).addClass( "cd-tabs__item--selected" );
}