在每个 div 中查找 div 并将其附加到 div

Question

我觉得这个问题很老了，但我没有找到适合我的正确答案。例如我有很多几乎相同的 div:

<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'));
});

Find div in each divs and append it to div