Повторяющиеся поля формы, которые хранятся в структуре таблицы

Я использую эту функцию, чтобы добавить дополнительный inputfield, если щелкнул последний inputfield в цикле.

$(function(){
    $(document).on('focus', 'div.input-group-option:last-child input', function(){
      var sInputGroupHtml = $('div.input-group-option:last-child').html();

      var sInputGroupClasses = $('div.input-group-option').attr('class');

      $('div.input-group-option').parent().append(`<div class = "${sInputGroupClasses}">${sInputGroupHtml}</div>`);

    });
});

Это отлично работает в этом случае:

<div class = "input-group-option-container">';
    for($y = 0; $y <= 4; $y++) { echo '
    <div class = "input-group-option">

    <div class = "form-group" id = "calc_pos_nr_div['.$y.'][]">
        <input type = "text" class = "form-control no-border input-sm" id = "calc_pos_nr['.$y.'][]" name = "calc_pos_nr[]" value = "">
        <span class = "" id = "calc_pos_nr_glyp['.$y.'][]"></span>
    </div>

    </div>'; } echo '
</div>

Но когда этот div находится в структуре таблицы, он не работает, какие-либо предложения, как изменить скрипт, чтобы он также мог работать с таблицами?

    <table class = "table">
<thead>
  <tr>
    <th>Pos.nr</th>
  </tr>
</thead>
<tbody>

<div class = "input-group-option-container">';
        <?php for($y = 0; $y <= 4; $y++) { echo '
        <div class = "input-group-option">

          <tr>
            <td>
                <div class = "form-group" id = "calc_pos_nr_div['.$y.'][]">
                    <input type = "text" class = "form-control no-border input-sm" id = "calc_pos_nr['.$y.'][]" name = "calc_pos_nr[]" value = "">
                    <span class = "" id = "calc_pos_nr_glyp['.$y.'][]"></span>
                </div>
            </td>
          </tr>

        </div> } ?>
    </div>
</tbody>
</table>