使用jQuery在表行上循环并将内容从一个单元格移动到另一个单元格

我试着在TRs上循环，从一个单元格中获取内容并将它们附加到另一个单元格中

$('.tableRow').each( function(){
    $( '.cell2', this).wrapInner("<div class='tempDiv'></div>");
    $('.tempDiv', this ).appendTo( ".cell1", this );
});

$（'.tableRow'）。每个（函数（）{
$（'.cell2'，this.wrapInner（“”）；
$（'.tempDiv'，this）.appendTo（“.cell1”，this）；
});

。。。但我得到的是，例如，如果一个表有4行，cell1将得到至少8次附加的tempDiv

---

fiddle:

我确信有一种更简洁的方法可以做到这一点，但让代码正常工作的最快方法是对jQuery进行一些更改：

$('.tableRow').each( function(){
    $(this).find('.cell2').wrapInner("<div class='tempDiv'></div>");
    $(this).find('.cell1').append($(this).find(".tempDiv"));
});

$（'.tableRow'）。每个（函数（）{
$（this.find（'.cell2'）.wrapInner（“”）；
$（this.find（'.cell1'）.append（$（this.find（.tempDiv））；
});

---

这是你想要的结果吗

$('.tableRow').each( function(){
    $(this).find('.cell2').wrapInner("<div class='tempDiv'></div>");
    $(this).find('.tempDiv').appendTo( $(this).find('.cell1') );
});

$（'.tableRow'）。每个（函数（）{
$（this.find（'.cell2'）.wrapInner（“”）；
$（this.find（'.tempDiv'）.appendTo（$（this.find（'.cell1'））；
});

这是一把小提琴：

按照编写的方式，每个单元格中的数据都被附加到类“cell1”的每个实例中。…

您在寻找什么

$（'.tableRow'）。每个（函数（）{
$（“.cell1”，本）
.append（$（“”）
.append（$（'.cell2'，this.html（））
);
});

是的，让我大吃一惊的是我认为“$（'.cell2'，this）”和“$（'.tempDiv'，this）”将循环中的当前TR指定为操作的cont ext。我显然错了。我在指定我感兴趣的上下文时哪里出错了。我想到了@amit_g所做的一些事情。$（这）始终只是在函数中定义的元素（在上面的函数中是

.tableRow

）。要处理$（this）中的元素，请使用诸如

.children（）

或

.find（）

之类的选择器。顺便说一句，我将

$（'.tempDiv'，this）

更改为

$（this）。find（'.tempDiv'）

对我来说更有意义。。。（实际上，我以前从未编写过任何类似于

$（'.tempDiv'，this）

的代码……但显然它的工作方式是相同的。）

$('.tableRow').each( function(){
    $(".cell1", this)
        .append($("<div class='tempDiv'></div>")
                    .append($( '.cell2', this).html())
               );
});