Как исправить jquery accordin?

[Sylon]

Всем привет! Помогите, пожалуйста, новичку разобраться и понять, что в коде jquery не так, чтобы сделать его работающим. С меня много симпатий. Мучаюсь уже очень долго...:-(

<script>
    jQuery(function($){
        $(`.multi-accordion`).on('click', '.multi-accordion li > a', function (event) {
           var $this = $(this), $next = $this.next();
           if ($next.length) {
             $next.slideToggle().parent().siblings().children('ul').filter(':visible').slideToggle();
            event.preventDefault();
           }
        });
    });
</script>

Разметка Html является динамической, то есть может меняться в зависимости добавления новых категорий или удаления в админ-панели. Поэтому <ul> и <li> без классов.

<div>
    <ul class="multi-accordion">
        <li><a href="http://agestor.ru/category-id3/category-level1a.html">Category level 1 (a)</a>
            <ul>
                <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2a.html">Category level 2 (a)</a></li>
                    <ul>
                        <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2a/category-level3a.html">Category level 3 (a)</a></li>
                        <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2a/category-level3b.html">Category level 3 (b)</a></li>
                        <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2a/category-level3c.html">Category level 3 (c)</a></li>
                    </ul>
                <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2b.html">Category level 2 (b)</a></li>
                <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2c.html">Category level 2 (c)</a></li>
            </ul>
        <li><a href="http://agestor.ru/category-id3/category-level1b.html">Category level 1 (b)</a></li>
        <li><a href="http://agestor.ru/category-id3/category-level1c.html">Category level 1 (c)</a></li>
    </ul>
</div>

Итог манипуляций на сайте (боковое вертикальное меню) - Для просмотра ссылки Войди или Зарегистрируйся

 

[Viodele]

Для начала, строка $(document).on('click', '.accordion li > a', function (event) { привязана к конкретному стилю, а именно .accordion, элементы которого отсутствуют в приведенном html коде. Класс .accordion, по всей видимости, должен быть назначен какому-то из элементов ul.

 

[Viodele]

Понятно. Ну, во-первых, у вас там синтаксическая ошибка в используемых кавычках:

Во-вторых, привязка триггера черт знает к чему сделана. Возможно вот то, что вы ищите:

jQuery(function($){
    $('.multi-accordion li > a').on('click', function (event) {
        var $this = $(this), $next = $this.next();
        if ($next.length) {
        $next.slideToggle().parent().siblings().children('ul').filter(':visible').slideToggle();
        event.preventDefault();
        }
    });
});

 

[Sylon]

Спасибо большое, очень помогли!!! А насчёт триггера, я так понимаю это event, это сделано, чтобы проверять есть ли вложение если есть, то отключается ссылка.
Помогите, пожалуйста, прикрутить куки, вот код попытки, но он не работает.

<script>
        jQuery(function($){
            var openItem = false;
            if($.cookie('openItem') && $.cookie('openItem') != 'false'){
                var openItem = parseInt($.cookie('openItem'));
            }
            $('.multi-accordion').accordion({
                active: openItem,
                collapsible: true,
                autoHeight: false
            });
            $('.multi-accordion li > a').on('click', function (event) {
                $.cookie("openItem", $("#accordion").accordion("option", "active"));
                var $this = $(this), $next = $this.next();
                if ($next.length) {
                $next.slideToggle().parent().siblings().children('ul').filter(':visible').slideToggle();
                event.preventDefault();
                }
            $('.multi-accordion > li').click(function(){
                $.cookie('openItem', null);
                var link = $(this).find('a').attr('href');
                window.location = link;
            });
        });
</script>