Есть меню. Нужно, чтобы при нажатии на любой из пунктов меню - он подчеркивался черной линией. При нажатии на следующий пункт меню - в предыдущем подчеркивание пропадало, а в новом - появлялось.
Вот мой код:
<script type="text/javascript">
$(document).ready(function(){
$('.topmenulink').click(
function() {
$( this ).removeClass('activelink');
}, function() {
$( this ).addClass('activelink');
}
);
});
</script>
.activelink {
color: #222;
border-bottom: 2px solid #222;
padding-bottom: 5px;
}
<span id="left-top-menu"><a class="topmenulink" href="/zhenschinam/">Женщинам</a></span>
<span id="left-top-menu"><a class="topmenulink" href="/muzhchinamm/">Мужчинам</a></span>
<span id="left-top-menu"><a class="topmenulink" href="/detjamd/">Детям</a></span>
Проблема в том, что при нажатии на ссылку - страница перезагружается и подчеркивание появляется только на момент нажатия и потом пропадает.
Вот живой пример: https://bigcitymart.ru/