CSS предыдущего списка элементов применяется к новому списку элементов в javascript

У меня 6 <div>, которые действуют как разные приложения. Каждый <div> содержит меню, и каждое меню содержит дочерние меню, которое является неупорядоченным списком. Каждое дочернее меню содержит теги <img> и <p>.

Я создал кнопку «Назад», поскольку я буду перемещаться между каждым из этих <div>, меню и дочерних меню. Все эти элементы будут иметь идентификатор.

Я создал массив для хранения истории всего списка элементов, который я буду посещать, используя

var pageHistory = { "History": [] };

. При щелчке каждый <div>, меню и дочернее меню, я добавляю их в массив pageHistory, используя pageHistory.History.push(menu);

Это работает нормально. Но когда я нажимаю кнопку «Назад» и перехожу от одного <div> к другому <div>, тогда CSS дочернего меню ранее выбранного <div> применяется к дочернему меню только что выбранного <div>.

Кроме того, выбранное меню не выделяется при нажатии кнопки «Назад».

Я хочу изменить CSS каждого элемента, как есть, и выделить выбранное меню и дочернее меню при нажатии кнопки «Назад» .