jQuery：テーブルに行を追加する

Question

JavaScriptとjQueryについて全く新しいので、今ではhtmlテーブルを変更しようとしています。

ボタンをクリックするたびに、最後の行としていくつかの項目（入力、テキスト、ボタン）を追加する必要があります。私は最初の行でそれを管理しましたが、もう一度ボタンをクリックすると、次の入力は最後の行の隣に追加され、その下には追加されません。なぜか分からない。あなたが手伝ってくれることを願います。

これは私のhtmlファイルです：

... 
<main> 
    <article id="main"> 
    ... 
    <section id="neue vorschlaege"> 
     ... 
     <table id="vorschlaege"> 
     <tr> 
      <td>Deine Idee</td> 
      <td>Vorschläge</td> 
      <td>Kategorie</td> 
      <td>Löschen</td> 
     </tr> 
     <!-- I want to insert new rows here --> 
     </table> 
    </section> 
    </article> 
    ... 
</main> 

そして、これは私のjQuery.jsです：あなたは</tr>終了タグで開始

$(document).ready(function(){ 
    $('#abschicken').on('click', function(add){ 
    add.preventDefault(); 
    var name = $("#name").val(); 
    var fvv = $('input[name=FVV]:radio:checked').next('label:first').html(); 
    var zutaten = $("#zutaten").val(); 
    var passwort = $("#pw").val(); 

    $('#vorschlaege > tbody:last-child').append(
     '</tr>' 
     +'<td><input type="checkbox" checked="true"></td>' 
     +'<td>'+name+'</td>' 
     +'<td>'+fvv+'</td>' 
     +'<td><button id="loeschen">löschen</button></td>' 
     +'</tr>'); 
    }); 
}); 

Answer 1

。

$('#vorschlaege > tbody:last-child').append(
      '<tr>'// need to change closing tag to an opening `<tr>` tag. 
      +'<td><input type="checkbox" checked="true"></td>' 
      +'<td>'+name+'</td>' 
      +'<td>'+fvv+'</td>' 
      +'<td><button id="loeschen">löschen</button></td>' 
      +'</tr>');