jquery - 使用 jQuery 根据第一个单元格文本向表中添加带有类的列/单元格

Question

我有下表...

<table>
    <tbody>
         <tr class="trclass">
             <td class="tdclass">Test1</td>
             <td class="tdclass">Test2</td>
             <td class="tdclass">Test3</td>
         </tr>
         <tr class="trclass">
             <td class="tdclass">Test4</td>
             <td class="tdclass">Test5</td>
             <td class="tdclass">Test6</td>
         </tr>
    </tbody>
</table>

如何在 (test2 和 test3) 和 (test5 和 test6) 之间的每一行中添加一个单元格，并使用基于第一个单元格 (test1 和 test4) 的文本的类？基本上看起来像这样......

<table>
    <tbody>
        <tr class="trclass">
            <td class="tdclass">Test1</td>
            <td class="tdclass">Test2</td>
            <td class="Test1">NewText</td>
            <td class="tdclass">Test3</td>
        </tr>
        <tr class="trclass">
            <td class="tdclass">Test4</td>
            <td class="tdclass">Test5</td>
            <td class="Test4">NewText</td>
            <td class="tdclass">Test6</td>
        </tr>
    </tbody>
</table>

我试过像

jQuery(".tdclass").after("<td>test</td>");

和

jQuery(".tdclass").append("<td>test</td>");

但我不确定如何循环并实现这个确切的场景。

Answer 1

你可以这样做：

$("tr.trclass").each(function() {
   var className = $(this).find("td:eq(1)").text();
   $(this).find("td:eq(1)").after("<td class=" + className + ">NewText</td>");
});

演示：http: //jsfiddle.net/ECu36/

Answer 2

我认为通过 css 属性可以很容易地控制如下：

$('tr.trclass').find('td:nth-child(2)').after('<td>testing123</td>');