Как выбрать определенные элементы вверх по дереву?

Question

[r_g_b_a]

Здравствуйте.
Есть такой пример меню jsfiddle.net
Как в данном случае мне сделать активными ссылки Категория 3 уровня => Категория 2 уровня => Категория 1 уровня, поднимаясь вверх по дереву?

Answer 1

[0xD34F]

.active {
  color: red;
}

const startFrom = '.link';
const parent = 'li';
const child = 'a';
const className = 'active';

$(startFrom).parents(parent).children(child).addClass(className);

// или

for (
  let el = document.querySelector(startFrom);
  el = el.parentNode.closest(parent);
  el.querySelectorAll(`:scope > ${child}`).forEach(n => n.classList.add(className))
) ;

Answer 2

[fallus]

Ну, если вверх по дереву, относительно кликнутой ссылки, не выходя за рамки .nav, то так:

$('.link').on('click', function(e){
	e.preventDefault();
	$(this).parentsUntil('.nav', 'li').find('a').css('color', 'red')
})