jQuery: das Hinzufügen von Zeilen zu einer Tabelle

Ich bin völlig neu für JavaScript und jQuery, und jetzt versuche ich zu ändern, eine html-Tabelle.

Jedes mal, wenn ein button geklickt wird, das einige Sachen (input, text, button) Hinzugefügt werden sollte als Letzte Zeile. Ich schaffte es, dass für die erste Zeile, aber wenn ich auf die Taste erneut, wird die nächste Eingabe Hinzugefügt werden neben der letzten Zeile und nicht unter ihm. Ich verstehe nicht, warum. Hoffe, Sie können helfen.

Dies ist meine html Datei:

...
<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>

- Und das ist meine jQuery.js:

$(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>');
  });
});

InformationsquelleAutor SuperTasche | 2016-11-23