使用 jQuery 复制 div 并附加到一组元素中的另一个元素

Question

我想克隆 div 并使用 jQuery 将其附加到 HTML table 中的另一个元素。例如

我想复制 div section_title 并立即将其附加到 append_class 范围内。换句话说，div section_title FIRST TITLE 将附加到跨度 append_class 等。

这里是HTML

<tr class="tr_class">
<th scope="row">
<div class="section_title">FIRST TITLE</div>
</th>
<td>
RANDOM CONTENT...
</td>
</tr>
<span class="append_class"></span>

<tr class="tr_class">
<th scope="row">
<div class="section_title">SECOND TITLE</div>
</th>
<td>
RANDOM CONTENT...
</td>
</tr>
<span class="append_class"></span>


<tr class="tr_class">
<th scope="row">
<div class="section_title">THIRD TITLE</div>
</th>
<td>
RANDOM CONTENT...
</td>
</tr>
<span class="append_class"></span>

我的尝试失败了。

var cloneTitle= $('.tr_class').find('.section_title').clone();
$('.append_class').html(cloneTitle);

它确实克隆了，但它克隆了所有 section_title 并相应地附加它们。

任何关于这方面的指导将不胜感激。

提前致谢

Answer 1

如果我明白你的意思你需要使用.each()和$(this)

$('.tr_class').each(function(){
   var cloneTitle = $(this).find('.section_title').clone();
    $(this).next('.append_class').html(cloneTitle);
});

使用 jQuery 复制 div 并附加到一组元素中的另一个元素

Copy div and append to a another element in a set of elements using jQuery

jquery

html-table

jquery-clone