Javascript 如何用JQuery动态地填充转置的HTML表？

我正在努力处理HTML表格格式。 因此，我得到了以下JQuery函数，它动态填充HTML格式，其中信息沿行填充

file.js

function createHTML( data ) {
    var next_row_num = 1;
       $.each( data.matches, function(i, item) {
            var this_row_id = 'result_row_' + next_row_num++;
            $('<tr/>', { "id" : this_row_id } ).appendTo('#matches tbody');
            $('<td/>', { "text" : item.accession } ).appendTo('#' + this_row_id);
            $('<td/>', { "text" : item.description } ).appendTo('#' + this_row_id);
            $('<td/>', { "text" : item.structural } ).appendTo('#' + this_row_id);
       }
 }

我很难理解如何让信息沿着列而不是行向下填充，从而使HTML采用以下格式

      <table>
          <thead>
            <tr>
              <td>Accession</td>
              <td></td>
            </tr>
            <tr>
              <td>Description</td>
              <td></td>
            </tr>
            <tr>
              <td>Structural</td>
              <td></td>
            </tr>
           </thead>
           <tbody>
           </tbody>
         </table>

---

您需要在

表中添加
id

<table id="matches">
<!-- Add an id in this element so your jquery will add data to this -->
     <thead>
       <tr>
        <td>Accession</td>
        <td>Description</td>
        <td>Structural</td>
      </tr>
    </thead>
    <tbody>
      <!-- this will be filled in by javascript when there are results -->
    </tbody>
</table>


加入
描述
结构的
这是获得结果的方法：

$('#matches thead').append('<tr/>').append('<td/>', { "text" : item.accession } );
$('#matches thead').append('<tr/>').append('<td/>', { "text" : item.description} ); 
$('#matches thead').append('<tr/>').append('<td/>', { "text" : item.structural} );

$（'#匹配thead'）.append（''）.append（''，{text:item.accession}）；
$（“#匹配thead”）.append（“”）.append（“”，{“text”：item.description}）；
$（“#匹配thead”）.append（“”）.append（“”，{“text”：item.structural}）；

这就是说，在AD下面有这样的行是没有意义的。很抱歉，您将AD（表头）与th（表列或行的表头）混淆了。
您能告诉我们您在
数据中得到了什么吗。匹配项
，这样我们就可以很容易地找到您的问题。@RohanKumar这是一个包含hashref的arrayref。已编辑/包含代码。@Steve您希望数据显示在thea中，并且非常像正确的键值对。你根本不想使用tbody？@PSL我无法对函数进行换位，所以我不确定哪一个更好。该表是id=matches部分的一部分
<table id="matches">
<!-- Add an id in this element so your jquery will add data to this -->
     <thead>
       <tr>
        <td>Accession</td>
        <td>Description</td>
        <td>Structural</td>
      </tr>
    </thead>
    <tbody>
      <!-- this will be filled in by javascript when there are results -->
    </tbody>
</table>

$('#matches thead').append('<tr/>').append('<td/>', { "text" : item.accession } );
$('#matches thead').append('<tr/>').append('<td/>', { "text" : item.description} ); 
$('#matches thead').append('<tr/>').append('<td/>', { "text" : item.structural} );