在每個div中找到div並將其附加到div

Question

我認爲這個問題很舊，但我沒有找到任何正確的答案。例如，我有噸幾乎相同的divs：

<div class="grid-item"> 
    <img src="url to img" /> 
    <div class="city">London</div> 
</div> 

// etc... 

此外，我有覆蓋圖像的頂部內容。我得到使用jQuery它：

$('.grid-item img').wrap('<div class=\'overlay-wrap\'></div>'); 
$('.grid-item img').after('<div class=\'overlay\'></div>'); 

的問題，我有：

$(".grid-item").each(function() { 
    $(this).find('.city').appendTo('.overlay'); 
}); 

此功能不能正常工作。每.grid-item每.overlay附加此功能。

問：

如何使它工作？我需要每個.city附加到它自己的.overlay。

謝謝你的任何答案。對不起英語不好。 聖誕快樂！

Answer 1

只要找到正確的疊加，你有父元素，使用它。

$(".grid-item").each(function() { 
    $(this).find('.city').appendTo($(this).find('.overlay')); 
});