Div下拉菜单显示/隐藏onclick jquery

Question

我正在尝试实施div下拉菜单。

JQuery：

<script>
    $(document).ready(function() {
        $('.desplegar').click(function() {
            $(this).next("div.desplegar_fills").show().siblings("div.desplegar_fills").hide();              
        });
    });
</script>

我知道这个jquery只会显示Subindex级别，但我甚至无法使其工作。

HTML here：

<div class="desplegar">
        <p>Index 1</p>
        <div class="desplegar_fills">
            <p>Subindex 1</p>
            <div class="desplegar_links">
                <a href="#">Enllaç 1</a>
                <a href="#">Enllaç 2</a>
                <a href="#">Enllaç 3</a>
            </div>
        </div>
    </div>
    <div class="desplegar">
        <p>Index 2</p>
        <div class="desplegar_fills">
            <p>Subindex 2</p>       
            <div class="desplegar_links">
                <a href="#">Enllaç 1</a>
                <a href="#">Enllaç 2</a>
                <a href="#">Enllaç 3</a>
            </div>
        </div>      
    </div>
    <div class="desplegar">
        <p>Index 3</p>
        <div class="desplegar_fills">
            <p>Subindex 3</p>       
            <div class="desplegar_links">
                <a href="#">Enllaç 1</a>
                <a href="#">Enllaç 2</a>
                <a href="#">Enllaç 3</a>
            </div>
        </div>      
    </div>  

它应该是这样的：

因此，如果我点击索引1，它会显示Subindex 1，如果我点击Subindex 1，它会显示链接。问题是，如果我点击索引2或索引3，索引1应该关闭，只显示子索引2或子索引3（取决于单击索引）。任何sugestions？谢谢大家！

Answer 1

请找到答案here。

基本上这个脚本应该完成这项工作：

$(document).ready(function() {
    $('.desplegar_fills').hide(0);
    $('.desplegar_links').hide(0);
    $('.desplegar').click(function() {
        $('.desplegar_fills').hide(0);
        $('.desplegar_links').hide(0);
        $(this).find(".desplegar_fills").show(0);
    });
    $('.desplegar_fills').click(function(e){
        $('.desplegar_links').hide(0);
        $(this).find(".desplegar_links").show(0);
        e.stopPropagation();
    })
});