Django dynamiczny wiersz tabeli za pomocą javascript

Chcę tylko dodać pole tekstowe lub pod datą, w zależności od liczby uczniów, ile pól tekstowych do dodania, umieszczę i przykład poniżej za pomocą zdjęć

 <table  id="myTable">
    <tr id="tr">
    <th>Students Name</th>
    <th>Average</th>
  </tr>
     {% for student in teacherStudents %}
  <tr id="tr2">
    <td id="td">{{ student.Students_Enrollment_Records.Student_Users }}</td>
  </tr>
      {% endfor %}
</table>
<button type="button" value="" class="save" onclick="doTheInsert()" title="Insert New Cell" id="save">&plus;&nbsp;Insert New Cell</button>

<button type="button" value="" class="save" onclick="undoTheInsert()" title="Undo Recent Action" id="unsave">&times;&nbsp;Undo Recent Action</button>
<script>
function doTheInsert() {
  var e = document.getElementById("save");
   for (i = 0; i <= 1-1; i++) {
    var newRow=document.getElementById('tr').insertCell(1);
    newRow.innerHTML = "<th style='background-color: #ccc;color: #000000;text-align:center;font-size: 16.5px'> <input type='date' name=''style='border: none; font-size:12px; padding: 0; '></th>";
    var newrow2=document.getElementById('tr2').insertRow(1);
    newrow2.innerHTML = "<td><input type='text'></td>"
  }
}
</script>
<script>
function undoTheInsert() {
  var e = document.getElementById("unsave");

  for (i = 0; i <= 1-1; i++) {
    var newRow=document.getElementById('tr').deleteCell(1);

    function doTheInsert() {
      var e = document.getElementById("save");
       for (i = 0; i <= 1-1; i++) {
        var newRow=document.getElementById('tr').insertCell(1);
        newRow.innerHTML = "<th style='background-color: #ccc;color: #000000;text-align:center;font-size: 16.5px'> <input type='date' name=''style='border: none; font-size:12px; padding: 0; '></th>";
        var newrow2=document.getElementById('tr2').insertRow(1);
        newrow2.innerHTML = "<td><input type='text'></td>"
      }
    }

    function undoTheInsert() {
      var e = document.getElementById("unsave");

      for (i = 0; i <= 1-1; i++) {
        var newRow=document.getElementById('tr').deleteCell(1);
        var newrow2=document.getElementById('tr2').deleteCell(1);


    }

    }

Jeśli nauczyciel kliknie przycisk wstaw komórkę, doda datę, a liczba pól tekstowych zależy od liczby uczniów

W moim przypadku tylko wyświetlanie daty

Pomóżcie mi, prawie tydzień próbowałem rozwiązać ten problem, ale nie udało mi się.