Javascript 在迭代过程中复制每个容器中的图像

我想在不影响原始图像的情况下，克隆节标题下每个节的

bgimage

这是我的HTML：

<div class="wrapper">
    <div class="section">
        <img class="bgimage" src="imagepath_1.jpg" alt="" />
        <h2>Title</h2>
        <!--clone goes here-->
    </div>
    <div class="section">
        <img class="bgimage" src="imagepath_2.jpg" alt="" />
        <h2>Title</h2>
        <!--clone goes here-->
    </div>
    <div class="section">
        <img class="bgimage" src="imagepath_3.jpg" alt="" />
        <h2>Title</h2>
        <!--clone goes here-->
    </div>
</div>

---

代码中的一个问题是

appendTo

将子元素添加到容器中。您真正想要的是

insertAfter

另一个问题是，您没有引用

每个

函数中的每个部分。您应该使用第二个函数参数

以下是一个解决方案：

$（文档）.ready（函数（$）{
$（'.section'）。每个（函数（索引，节）{
var image=$（section）.find（'img.bgimage'）.first（），
title=$（section.find（'h2'）.first（）；
image.clone（）.insertAfter（标题）；
});
});
部分{
边框：1px实心#888；
利润率：10px；
}

第一节
第二节
第三节
没问题。请按下按钮接受我的答案（如果你还没有投票，请也投票）。
$(document).ready(function($) {
    $('.section').each( function (index, data) {    
        $(this).find('img.bgimage').first().clone().appendTo('.section h2').first();
    });
});