javascript - JQuery、アコーディオン、複数のメニュー

Question

Wayfinder と Accordion メニューの組み合わせを使用して、左側の列メニューの動作を駆動しています。このメニューには次の 2 つのレベルがあります。

<ul class="accordion">:
Menu 1
    Sub-menu 1.1
    Sub-menu 1.2    
    Sub-menu 1.3
Menu 2
    Sub-menu 2.1
    Sub-menu 2.2    
Menu 3
    Sub-menu 3.1
    Sub-menu 3.2    
Menu 4
    Sub-menu 4.1
    Sub-menu 4.2    

次のヘッダー メニューもあります。

<ul class="nav"> (no sub-menus):
Menu 2
Menu 3

以下のコードは、左側の列メニュー (「アコーディオン」クラス) を処理します。コードを拡張したいので、ヘッダー メニュー (「nav」クラス) から「Menu 2」をクリックすると、「Menu 2」(「accordion」クラス) をクリックするのとまったく同じ効果が得られます。つまり、'Menu 2' ("nav" クラス) をクリックすると、"accordion" クラスの 'Menu 2' が展開されます。

彼女のコードは次のとおりです。

<script type="text/javascript">

    $(document).ready(function() {

        // Store variables

        var accordion_head = $('.accordion > li > a'),
            accordion_body = $('.accordion li > .sub-menu'),
            nav_head = $('.nav > li > a');

        // Open the first tab on load

        accordion_head.eq(2).addClass('active').next().slideDown('normal');         

        // Click function

        accordion_head.on('click', function(event) {

            // Disable header links

            event.preventDefault();

            // Show and hide the tabs on click

            if ($(this).attr('class') != 'active'){
                accordion_body.slideUp('normal');
                $(this).next().stop(true,true).slideToggle('normal');
                accordion_head.removeClass('active');
                $(this).addClass('active');
            }
            else {
                    accordion_body.slideUp('normal');
                    accordion_head.removeClass('active');
                }
        });
        nav_head.on('click', function(event) {

            // Disable header links

            event.preventDefault();

            // Show and hide the 'accordion tabs' on click on the 'nav tabs'

            <missing part>

        });
    });
</script>

どうもありがとう、LG