Reputation: 3904
I think this question is old, but i didnt finded any correct answer for me. For example i have tons of almost same divs:
<div class="grid-item">
<img src="url to img" />
<div class="city">London</div>
</div>
// etc...
Also, i have overlay content on top of image. I get it using jquery:
$('.grid-item img').wrap('<div class=\'overlay-wrap\'></div>');
$('.grid-item img').after('<div class=\'overlay\'></div>');
The problem i have:
$( ".grid-item").each(function() {
$(this).find('.city').appendTo('.overlay');
});
This function does not work properly. This function appends to every .overlay
in every .grid-item
.
Question:
How to make it work? I need that every .city
appends to its own .overlay
.
Thank you for any answers. Sorry for bad english. Merry christmas!
Upvotes: 0
Views: 32
Reputation: 97717
Just find the right overlay, you have the parent element, use it.
$( ".grid-item").each(function() {
$(this).find('.city').appendTo($(this).find('.overlay'));
});
Upvotes: 4