trouver l'image à partir du texte et ajouter à div

Question

J'ai des problèmes à essayer de trouver une image à l'intérieur d'une div et l'ajouter à une div vide. Voici le code que j'ai:

<div class="newsItem"> 
    <div class="newsImage"></div> 
    <h2><a href="">Latest News 03</a></h2> 
    <div class="newsIntro">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce dictum sagittis sapien. Aliquam erat volutpat. Nulla facilisi. Ut purus neque, condimentum nec, auctor eget, semper ut, enim. Vestibulum sem tellus, vestibulum a, vehicula ut, feugiat id, libero. Pellentesque enim justo, condimentum sed, dictum at, viverra eget, odio. Aliquam feugiat metus id lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam iaculis iaculis quam. Donec eu dui. Morbi quis nulla.</div> 
    <div class="clear"></div> 
</div> 
<div class="newsItem"> 
    <div class="newsImage"></div> 
    <h2><a href="">Latest News 03</a></h2> 
    <div class="newsIntro"><img src="/images/stories/img_abopal3.jpg" border="0" alt="Opal History" align="right" />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce dictum sagittis sapien. Aliquam erat volutpat. Nulla facilisi. Ut purus neque, condimentum nec, auctor eget, semper ut, enim. Vestibulum sem tellus, vestibulum a, vehicula ut, feugiat id, libero. Pellentesque enim justo, condimentum sed, dictum at, viverra eget, odio. Aliquam feugiat metus id lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam iaculis iaculis quam. Donec eu dui.</div> 
    <div class="clear"></div> 
</div> 
<div class="newsItem"> 
    <div class="newsImage"></div> 
    <h2><a href="">Latest News 02</a></h2> 
    <div class="newsIntro"><img src="/images/stories/img_abopal6.jpg" border="0" alt="Opal History" align="right" />Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce dictum sagittis sapien. Aliquam erat volutpat. Nulla facilisi. Ut purus neque, condimentum nec, auctor eget, semper ut, enim. Vestibulum sem tellus, vestibulum a, vehicula ut, feugiat id, libero. Pellentesque enim justo, condimentum sed, dictum at, viverra eget, odio. Aliquam feugiat metus id lacus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam iaculis iaculis quam. Donec eu dui.</div> 
    <div class="clear"></div> 
</div> 

Voici le jQuery:

jQuery(".newsItem").each(function() { 
    var thumbImage = jQuery(this).find(".newsIntro img"); 
    jQuery(thumbImage).appendTo(".newsImage"); 
}); 

Je peux l'obtenir pour trouver les images, mais ne peut pas sembler l'obtenir pour les placer correctement, actuellement les images se répètent à l'intérieur du div newsImage .. Si quelqu'un pourrait me diriger dans la bonne direction, ce serait génial :)

Vive

Answer 1

Je pense que c'est ce que vous êtes après:

jQuery(".newsItem").each(function() { 
    var thumbImage = jQuery(this).find(".newsIntro img"); 
    jQuery(thumbImage).appendTo(jQuery(this).find(".newsImage")); 
}); 

You can give it a try here, ou une approche légèrement différente:

jQuery(".newsImage").each(function() { 
    $(this).append($(this).siblings('.newsIntro').find('img')); 
}); 

You can test it here. Si vous ne voulez pas déplacer le <img> il suffit d'ajouter un .clone() à la partie de l'image soit, par exemple. .find('img').clone() dans la seconde.