Jquery 将新的HTML行添加到HTML表内的组

我有以下表格结构：

<table id="myTable">
    <tr id="myRow" class="content">
        <td>Option 1</td>
    </tr>
      <tr class="content">
        <td>Option 2</td>
    </tr>

    <tr class="altcontent">
        <td>file code 1 </td>
    </tr>
      <tr class="altcontent">
        <td>file code 2</td>
    </tr>

      <tr class="content">
        <td>Option 3</td>
    </tr>
      <tr class="content">
        <td>Option 4</td>
    </tr>

      <tr class="altcontent">
        <td>file code 3 </td>
    </tr>
      <tr class="altcontent">
        <td>file code 4</td>
    </tr>

</table>

var newContentRow = $("<tr></tr>"); 

选择1
选择2
文件代码1
文件代码2
选择3
选择4
文件代码3
文件代码4
var newContentRow=$（“”）；

我想在选项2和选项4之后添加newContentRow。当然，这只是一个示例，可以有许多选项，其中包含许多或非文件代码行

任何想法

更新1:

我将代码更新为以下建议：

  var searchClass = "TBLCONTENTS";

    var rows = $("#" + rowId).parent().children("tr");   

    for(i=0;i<rows.length;i++) {


        if ($(rows[i]).attr('class') != searchClass && $(rows[i]).prev().attr('class') == searchClass) {

            $(rowToBeAdded).addClass("TBLCONTENTS");
            $(rows[i]).before(rowToBeAdded);

   }               
   }

var searchClass=“TBLCONTENTS”；
var rows=$（“#”+rowId）.parent（）.children（“tr”）；
对于（i=0；i试试这个

$('#myTable')
.find('td:contains("Option 2")'
.parent()
.after("<tr><td></td></tr>")

$（“#myTable”）
.find（'td:contains（“选项2”）'
.parent（）
.在（“”）之后

您可以使用我使用的任何选择器
：contains（）
查找需要添加新行的前后行。使用
after
方法在后面添加新行，或使用
after
方法在前面添加新行。
尝试此操作

$('#myTable')
.find('td:contains("Option 2")'
.parent()
.after("<tr><td></td></tr>")

// Loop through each row,
// ... if the current class is different than your desired set,
// ... and the previous row is the same as your desired set,
// ... inject a row before it.

classSet='content';

$('#myTable TR').each( function(){

    if( $(this).attr('class') != classSet && $(this).prev().attr('class') == classSet ){

        $(this).before('<tr class="' + classSet + '"><td>new option</td></tr>');

    }

});

$（“#myTable”）
.find（'td:contains（“选项2”）'
.parent（）
.在（“”）之后

您可以使用任何选择器，如我使用的
：contains（）
查找需要添加新行的后面/前面的行。使用
after
方法在后面添加新行，或使用
after
方法在前面添加新行。
//循环遍历每一行，
// Loop through each row,
// ... if the current class is different than your desired set,
// ... and the previous row is the same as your desired set,
// ... inject a row before it.

classSet='content';

$('#myTable TR').each( function(){

    if( $(this).attr('class') != classSet && $(this).prev().attr('class') == classSet ){

        $(this).before('<tr class="' + classSet + '"><td>new option</td></tr>');

    }

});

//…如果当前类与所需集不同，
//…上一行与所需的集合相同，
//…在它前面插入一行。
classSet='content'；
$（'#myTable TR'）。每个（函数（）{
if（$（this.attr（'class'）！=classSet&$（this.prev（）.attr（'class'）==classSet）{
$（此）。在（‘新选项’）之前；
}
});
//循环每一行，
//…如果当前类与所需集不同，
//…上一行与所需的集合相同，
//…在它前面插入一行。
classSet='content'；
$（'#myTable TR'）。每个（函数（）{
if（$（this.attr（'class'）！=classSet&$（this.prev（）.attr（'class'）==classSet）{
$（此）。在（‘新选项’）之前；
}
});
选项2只是一个例子！它可以是任何东西。我想我需要对类名做些什么，因为它们是不同的。是的，你可以使用任何选择器查找必须添加行的前后行。在你的代码中，它会在每个选项后添加新行。我不希望这样。我需要在每个组中添加一次新行选项。它不会在每个选项后添加新行，而是在包含“选项2”的行后添加新行。如果您知道类，请使用类选择器。可能我没有解释清楚！忘记TD中有任何内容。忘记文本“选项”。我如何才能为每个组只添加一次新行。选项1和选项2被视为一个组，因此它应该添加一次新行，而不是两次。选项3和选项4也是如此。选项2只是一个示例！它可以是任何内容。我想我需要对类名进行处理，因为它们不同。是的，您可以使用任何选择器来查找后面的行er或之前添加行。在代码中，它将在每个选项后添加新行。我不希望这样。我需要在每组选项中添加一次新行。它不会在每个选项后添加新行，而是在包含“选项2”的行后添加新行。如果你知道这个类，那么使用类选择器。也许我没有解释清楚！忘记TD中有任何内容。忘记文本“选项”。我如何才能为每个组只添加一次新行。选项1和选项2被视为一个组，因此它应该添加一次新行，而不是两次。与选项3和选项4相同。我实际上改变了这一点，因为我得到的印象是，他只想在具有特定类的集合中添加新行（即，“content”而不是“altcontent”）。如果我在before函数中使用，则您的代码效果非常好。如果我尝试添加自己的rowToBeAdded，则它只添加一次。我只添加了rowToBeAdded.clone（）现在它开始工作了。我想那是因为我被添加了jQuery对象到列表中，而你不能添加两次相同的对象！我实际上改变了这一点，因为我得到的印象是他只想添加一个新行到具有特定类的集合中（即，“content”而不是“altcontent”）。如果我在before函数中使用，则您的代码效果非常好。如果我尝试添加自己的rowToBeAdded，那么它只添加一次。我刚刚添加了rowToBeAdded.clone（），现在它可以工作了。我想这是因为我将jQuery对象添加到列表中，而您不能添加同一对象两次！