На сайте существует многоуровневое меню. Подскажите как сделать родительский элемент меню активным пунктом, дочерний элемент которого был нажат пользователем.
Пример меню:
<ul class="ul-one">
<li class="li-one">
<a href="#">Пункт #1</a>
<ul class="ul-two">
<ul class="ul-free">
<h4><a href="#">Подпункт #1</a></h4>
<li><a href="#">Подпункт #2</a></li>
<li><a href="#">Подпункт #3</a></li>
<li><a href="#">Подпункт #4</a></li>
</ul>
<ul class="ul-free">
<h4><a href="#">Подпункт #5</a></h4>
<li><a href="#">Подпункт #6</a></li>
<li><a href="#">Подпункт #7</a></li>
<li><a href="#">Подпункт #8</a></li>
</ul>
<ul class="ul-free">
<h4><a href="#">Подпункт #9</a></h4>
<li><a href="#">Подпункт #10</a></li>
<li><a href="#">Подпункт #11</a></li>
<li><a href="#">Подпункт #12</a></li>
</ul>
<ul class="ul-free">
<h4><a href="#">Подпункт #13</a></h4>
<li><a href="#">Подпункт #14</a></li>
<li><a href="#">Подпункт #15</a></li>
<li><a href="#">Подпункт #16</a></li>
</ul>
</ul>
</li>
</ul>
При нажатии на (например!)
Подпункт #9, у тега li, с классом
li-one должен добавиться класс
active.