javascript - jQueryを使用して完全なHTMLテーブルを作成するには?

Question

jQuery を使用して完全なテーブルを作成したいと考えています。

私はこの質問から学ぶか、模倣しようとします

jQuery でテーブルを作成 - 追加

しかし運がない。

私が作りたいのは、

<table>
   <thead>
      <tr>                                  
         <th>Problem 5</th>
         <th>Problem 6</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>1</td>
         <td>2</td>
      </tr>
   </tbody>
</table>

私が作成したjQueryコードは

var $table = $('<table/>');

var $thead = $('<thead/>');
$thead.append('<tr>' + '<th>Problem 5</th>' + '<th>Problem 6</th>' + '</tr>';
$table.append(thead);

var $tbody = $('<tbody/>');
$tbody.append( '<tr><td>1</td><td>2</td></tr>' );
$table.append(tbody);

$('#GroupTable').append($table);

しかし、実行に失敗しました。

誰でも理由を教えてもらえますか?

Answer 1

$thead宣言に右括弧がありません:

$thead.append('<tr>' + '<th>Problem 5</th>' + '<th>Problem 6</th>' + '</tr>'); 
                                                                            ^

変数を正しく追加していません：

$table.append($thead);
              ^

$table.append($tbody);
              ^

これが実用的なフィドルです。

Answer 2

thead、tbody は未定義ですか? $thead、$tbody?

$table.append(thead);

と

$table.append(tbody);