Выделение меню CSS и JS

Есть сайт, собранный на Python + Django.

В нем два меню в разных местах.

Первое меню - главное, состоит из главных элементов ( к примеру создать пользователя, расписание и тд)

Второе меню - второстепенное ( к примеру при нажатии на главном меню к примеру на "расписание", открывается окно с второстепенным меню в другом месте)

Необходимо сделать, чтобы при нажатии на главном меню подсвечивалось главное меню, и при нажатии на второстепенном меню главное меню оставалось подсвеченным и подсвечивалось второстепенное меню.

Сейчас использую данных JS скрипт, но он проверяет ссылку, которая сейчас активна, но переходя во второстепенном меню на любой меняется ссылка и подсветка главного не работает.

Пример ссылок: Главное меню - mysite.com/dashboard

Второстепенное меню - mysite.com/dashboard/item1

    <script type="text/javascript">

  $(document).ready(function(){
    var link = window.location.pathname;
    $('.menu li a[href="'+link+'"]').parent().addClass('active');


  });

    </script>

Может не совсем понятно объяснил, если вкратце - нужно выделить главное меню и второстепенное:

Главное меню - mysite.com/dashboard (нужно выделить)

Второстепенное меню - mysite.com/dashboard/item1 ( нужно выделить, если оно активно)

Второстепенное меню - mysite.com/dashboard/item2

Вернуться на верх