jquery - 当多个 div 具有相同名称时，只关闭一个类

Question

我正在动态创建这棵树，问题是因为它们都有相同的类名，所以它会关闭所有打开的 div。

我正在尝试使用$(this).parent().next('.sticker').hide();，但没有任何反应。我用错了吗？

    $('#note-btn').click(function() {
        $.get('xml/note.xml', function(data) {
            $(data).find('notes').each(function() {

                var notes = '<div class="notes">';

                notes += '<div class="notes-close">' + '</div>';
                $('#page-content-wrapper').append(notes);
            });

            $(".notes-close").click(function()
            {
                $(this).parent().next('.notes').toggle();
            });

        });

    });
});

这个的输出是。

<div id="page-content-wrapper">
<div class="notes"> 
<div class="notes-close"></div> 
</div> 
</div>

其中 note-close 是笔记的关闭按钮，

Answer 1

我假设你的关闭按钮应该关闭当前的笔记，所以.next()/.prev()是不需要的。您可以使用.closest()将 DOM 向上移动到第一个.notes和.toggle()那个。

代替：

$(this).parent().next('.notes').toggle();

和：

$(this).closest('.notes').toggle();