Как найти родителя элемента с проверкой наличия класса?

Question

[Лев Салатов]

Доброго времени суток!

Имеется структура:

<ul class="parent">
     <li>Родитель</li>
     <li>Родитель</li>
     <li>
          Родитель
          <ul class="child">
               <li>Ребенок</li>
               <li class="active_link">Ребенок</li>
               <li>Ребенок</li>
          </ul>
     </li>
</ul>

<ul class="parent">
     <li>Родитель</li>
     <li>Родитель</li>
     <li>
          Родитель
          <ul class="child">
               <li>Ребенок</li>
               <li>Ребенок</li>
               <li>Ребенок</li>
          </ul>
     </li>
</ul>

Нужно провести проверку наличия класса .active_link и добавить класс к ul родителя .parent

Проверка на наличие класса:

if($(".child li").hasClass('active_link')){
          // найти ближайшего предка .parent и добавить класс .active_list
     }

Простите за глупый вопрос и заранее спасибо!

Comments

[Лев Салатов]

Видимо что-то не так делаю раньше.
У меня на работает: parent, parents, prev, closest

Вот код полностью (между script), может функции на хватает:

$(document).ready(function(){
     if($(".child li").hasClass('active_link')){
          $(this).closest('ul.parent').addClass('active');
     }
});

Answer 1

[0xD34F]

$(elem).closest('.parent').addClass('active_list')

Comments

[Лев Салатов]

0xD34F , простите, видимо что-то не так делаю раньше.
У меня на работает: parent, parents, prev, closest

Вот код полностью (между script), может функции на хватает:

$(document).ready(function(){
     if($(".child li").hasClass('active_link')){
          $(this).closest('ul.parent').addClass('active');
     }
});

[0xD34F]

Лев Розанов, может, вы имеете в виду

$('.child li.active_link').closest('ul.parent').addClass('active')

?

[Лев Салатов]

0xD34F, о дааа! Огромное спасибо за помощь.

Answer 2

[BarryHAllen]

native javascript:
let element = document.getElementById(id),
parent = element.parentNode,
hasClass = parent.classList.contains(class)
console.log(hasClass);

Comments

[Лев Салатов]

Простите, видимо что-то не так делаю раньше.
У меня на работает: parent, parents, prev, closest

Вот код полностью (между script), может функции на хватает:

$(document).ready(function(){
     if($(".child li").hasClass('active_link')){
          $(this).closest('ul.parent').addClass('active');
     }
});

Answer 3

[Arman]

?
$el.closest('.parent');

Comments

[Лев Салатов]

Простите, видимо что-то не так делаю раньше.
У меня на работает: parent, parents, prev, closest

Вот код полностью (между script), может функции на хватает:

$(document).ready(function(){
     if($(".child li").hasClass('active_link')){
          $(this).closest('ul.parent').addClass('active');
     }
});

Answer 4

[Stimulate]

$(this).closest('ul.parent').addClass('new_class');

Comments

[Лев Салатов]

Простите, видимо что-то не так делаю раньше.
У меня на работает: parent, parents, prev, closest

Вот код полностью (между script), может функции на хватает:

$(document).ready(function(){
     if($(".child li").hasClass('active_link')){
          $(this).closest('ul.parent').addClass('active');
     }
});

Answer 5

[Амир Алимжанов]

вроде так, если по клику на li нужно проверить есть ли у его родителя ul класс .parent
jquery:

$('li').on('click', function(){
$(this).closest('ul').hasClass('parent');
})

Comments

[Лев Салатов]

Простите, видимо что-то не так делаю раньше.
У меня на работает: parent, parents, prev, closest

Вот код полностью (между script), может функции на хватает:

$(document).ready(function(){
     if($(".child li").hasClass('active_link')){
          $(this).closest('ul.parent').addClass('active');
     }
});

[Лев Салатов]

И нет проверки на клик.

[Амир Алимжанов]

Лев Розанов, аа, я либо не так прочитал, либо ты изменил описание, не знал то что сейчас написано в вопросе.

Answer 6

[leni_m]

$("li").on("click", function() {
    $(this).parents(".parent"); // ищет родителя по всему дереву с классом parent
    $(this).find(".child"); // ищет дитё элемента по всему дереву с классом child
});

Comments

[Лев Салатов]

Простите, видимо что-то не так делаю раньше.
У меня на работает: parent, parents, prev, closest

Вот код полностью (между script), может функции на хватает:

$(document).ready(function(){
     if($(".child li").hasClass('active_link')){
          $(this).closest('ul.parent').addClass('active');
     }
});

[Лев Салатов]

И нет проверки на клик.

[leni_m]

Лев Розанов, this уместно, когда есть событие:

el.click(... this ...) // именно тот, на который кликнули, из всех
el.mouseenter(...this...) // именно тот el из всех el, на который навели мышкой, думаю вы поняли

если вам надо после загрузки страницы проверить каждый li, то как-то так:

$(".child li").each(function() { // перебираем каждый li по отдельности, а то у вас $(".child li") возвращает все элементы и у каких-то наверное есть класс, у каких-то нет и программе не понять $(".child li").hasClass('active_link')
    if($(this).hasClass('active_link')) { // тут this означает тот элемент, который мы перебираем, потому что внутри each()
        $(this).parents(".parent").addClass("active"); // ищем родителя с классом parent и добавляем ему класс active
    }
});

а в вашем коде this означает $(document), думаю вы не его имели ввиду