Нужно назначать кликнутой ссылке отдельный класс, который бы обозначал её активность.
Это делает на основании адреса страницы либо бэкенд при генерации шаблона, либо JS, если это SPA.
В представленной песочнице это может выглядеть примерно так:
.nav ul li a.active {
text-decoration: underline;
text-decoration-thickness: 2px;
text-underline-offset: .1em;
}
const $links = document.querySelectorAll('.nav a');
Array.from($links).forEach(($link) => {
$link.addEventListener('click', (event) => {
document.querySelector('.nav a.active')?.classList.remove('active');
event.target.classList.add('active');
})
});
Простой
