Javascript 在取出元素后保留对子元素的引用

我试图创建一个修改子元素的函数。 稍后，子元素被附加到其他地方，但我仍然需要一种将其引用到原始父元素的方法

例如

我的父元素有item类，其中有一个子元素，类为“modal”。我认为，通过在一开始绑定这个函数，“var modal”应该已经指向元素的子元素“.modal”，这样当我稍后调用它时，它在dom中的位置就无关紧要了。。但是我错了。。在bind'modal'函数中使用闭包对我有帮助吗

看看我的小提琴

---

下面是一个使用闭包的示例

$('.item').bind('modal', (function() {
    var modal = $(".item").find('.modal');
    return function(){
        modal.hide();
    };
})());

$('.item .modal').appendTo('#append');
$('#item').trigger('modal');

---

我能这样做

我使用“this”作为引用独立地迭代这些项，这样我可以缓存我需要的子元素，这样当我绑定事件时，我就引用了正确的元素

$('.item').each(function() {
    // attach one event at a time
    var modal = $(this).find('.modal');
    $(this).bind('modal', function() { 
      modal.hide();
    });
});
$('.item .modal').appendTo('#append');
$('#item').trigger('modal');

$('.item').each(function() {
    // attach one event at a time
    var modal = $(this).find('.modal');
    $(this).bind('modal', function() { 
      modal.hide();
    });
});
$('.item .modal').appendTo('#append');
$('#item').trigger('modal');