Найти дочерний список

#jquery

#jquery

Вопрос:

У меня есть такая HTML-структура:

 <ul class="shopp_categories">
<li><a href="#">TEXT</a>
    <ul class="children">
        <li><a href="#">TEXT</a></li>
    </ul>
</li>
<li><a href="#">Text</a></li>
<li><a href="#">TEXT</a>
    <ul class="children">
        <li><a href="#">TEXT</a></li>
    </ul>
</li>    
</ul> 
  

Это мой js-код:

 jQuery('#sidebar .shopp_categories ul.children').parent().prepend('<span class="sidebar_cats_more"></span>');
jQuery('.sidebar_cats_more').click(function(){
  var $children_list = jQuery(this).find('ul').children().children();
  alert($children_list.html());
  $children_list.slideToggle(1000, function () {
        if ( $children_list.is(':visible') ) {

        }
        if ( $children_list.is(':hidden') ) {

        }
        });
  });
  

Мне нужно найти дочерний список из элемента списка, где

 span.sidebar_cats_more
  

Было добавлено к. Если я нашел этот список, он должен быть анимирован с помощью slideToggle.
Проблема находится в этой строке:

 var $children_list = jQuery(this).find('ul').children().children();
  

Ответ №1:

<ul> Элемент не является дочерним по отношению к .sidebar_cats_more ; это дочерний элемент следующего за ним элемента. (к которому вы его добавили).

Напишите $(this).parent().find('ul') или $(this).next().find('ul') .

Ответ №2:

у span.sidebar_cats_more нет дочерних элементов, поэтому он не найдет элемент ul. попробуйте

 var $children_list = jQuery(this).siblings('ul');