javascript - 作为 jquery 响应的附加行组不遵循表条纹表样式

Question

我有第一个表单提交的第一个表响应。该表使用定义的 boostrap.css 样式 n.table-striped 将奇数行设置为白色 bg:

<table class="table table-striped" id="offers-product">

在 boostrap.css 中

.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #f9f9f9;
}

后端返回前10个结果；如果最终用户希望再获得 10 个，则有一个按钮“更多结果”，单击该按钮会触发以下 jquery 代码:

function show_offers(render, from_item, to_item, products_id_list, searchedGeneric, searchedMade, searchedCountries, searchedFormats, searchedCurrency){

      if (render == 'PCRender') {

   $.ajax({
      method:'POST',
      url: ajax_url+'frontController/addRenderPCScreenOffers',
      data:{  render:render,
              from_item:from_item,
              to_item:to_item,
              products_id_list:products_id_list,
              searchedGeneric:searchedGeneric,
              searchedMade:searchedMade,
              searchedCountries:searchedCountries,
              searchedFormats:searchedFormats,
              searchedCurrency:searchedCurrency
           },
      dataType:'text',

      success:function(res)
      { 
        $("#offers-product").append(res);
      }

   });   

}

}

显然，res 具有正确的 html 行代码。问题在于添加的行不符合表格样式 table-striped，因此奇数行与偶数行具有相同的 bk；只是添加的行，第一行没问题。我怎样才能让添加的行也尊重正确的表格样式，交替使用它们的黑色颜色？

Answer 1

@Kasper Halvas Jensen 和@David Thomas 的建议解决了这个问题，谢谢。所以总而言之，我已经替换了这个

$("#offers-product").append(res);

有了这个

$("#offers-product tbody").append(res);