Search code examples
jqueryhtmlimageappendtodetach

find all img tags inside html and move all to a certain div by jquery

I have HTML code that contains images. Now, I try to find all images inside this html and move them to another div

This is HTML code

<div class="gallery slider" data-autoplay="true" data-autoheight="true">
  <figure>
    <div><img src="http://localhost/cms/source/41d78c1785d38ec8086941cf55971aef.jpg" alt=""></div>
  </figure>
</div><!-- gallery -->
<div id="trip-body">
    <img src="http://localhost/cms//source/img-09.jpg" alt="img-09">
</div>

and this is my Jquery

$('#trip-body').each(function () {
    var tripBody  = $(this);
    var tripImage = $(tripBody).find('img');

    $(tripImage).detach().appendTo('.post-area .slider figure');
});

but it doesn't work!

Solution

  • Try this instead

    $('#trip-body img').each(function () {
    $(this).detach().appendTo('.slider > figure');
});

    JSFiddle