Хотел реализовать вертикальное меню виджета категорий товаров как аккордеон, которая при нажатии на определенную категорию раскрывала подкатегории. Пробовал плагины, но толкового решения не нашел. Наткнулся на одну
статью, но реализовать не могу. Структура меню и классы идентичная.
<ul class="product-categories">
<li><a>Для малышей</a></li>
<li><a>Для мальчиков</a></li>
<li><a>Для девочек</a></li>
<li class="cat-parent"><a>Прочие игрушки</a>
<ul class='children'>
<li><a>Фигурки и персонажи</a></li>
<li><a>Игры</a></li>
<li><a>Конструкторы и головоломки</a></li>
<li><a>Другие игрушки</a></li>
</ul>
</li>
<li class="cat-parent"><a>Прочие товары</a>
<ul class='children'>
<li class="cat-item cat-item-19"><a>Мобили</a></li>
</ul>
</li>
</ul>
Добавлял js код
$(function() {
$('.product-categories .cat-parent').children('a').click(function() {
$(this).siblings('.children').slideToggle();
return false;
});
});
И CSS
ul.children{
display: none;
}
Но результата нет. Дочерние категории скрылись, но при нажатии так и ничего не происходит. Подскажите пожалуйста в чем может быть причина. Или есть ли какое нибудь альтернативное решение (без плагинов)?