Tauras
Tauras

Reputation: 3904

Find div in each divs and append it to div

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

Answers (1)

Musa
Musa

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

Related Questions