Почему клонирование последнего элемента не работает в jQuery?

Question

Я пытаюсь клонировать последнюю строку моей таблицы после нажатия кнопки сохранения. Но просто не клонирует и не добавляет новую строку.

Что он должен делать: Нажмите «Сохранить» -> добавить <tr class="spacer"> и новый <tr class="tr-shadow">. Скриншот:

Мой код:

                                            ... <tr class="tr-shadow">
                                            <td><select name='weekday[]'>
                                                    <option value='0' selected hidden disabled>Auswählen</option>
                                                    <option value='1'>Montag</option>
                                                    <option value='2'>Dienstag</option>
                                                    <option value='3'>Mittwoch</option>
                                                    <option value='4'>Donnerstag</option>
                                                    <option value='5'>Freitag</option>
                                                    <option value='6'>Samstag</option>
                                                    <option value='7'>Sonntag</option></select></td>
                                            <td><input type="text" name="title[]" placeholder="Title"></td>
                                            <td><select name='rythm[]'>
                                                    <option value='1'>jede Woche</option>
                                                    <option value='2'>nur erster des Monats</option></select></td>
                                            <td><input type="time" name="time[]" placeholder="08:00" required></td>
                                        </tr><tr class="spacer"></tr>
                                    </tbody>

                                </table>
                                <br><input type="submit" id="date-submit" class="au-btn au-btn-icon au-btn--green au-btn--big" value="Save">

И мой jQuery:

                             <script> 
$("#date-submit").click(function(){
    event.preventDefault();
    //$('#dates .tr-shadow').eq(-1).after('<tr class="spacer">');
    $("#dates .tr-shadow:last").clone().add("#dates .tr-spacer:last");

    request = $.ajax({
    url: "./termin-update.php",
    type: "post",
    data: $("#entrydates").serialize(),
    error: function (XMLHttpRequest, textStatus, errorThrown) {
        snackbar('Error','error');
    },
    success: function (response) {
        snackbar('Successfully saved','success');
    }

    });
});
        </script>   

Answer 1

Вы создаете клон, но не сохраняете ссылку на него или не связываете с ним метод вставки ... другими словами, ничего не делаете с клоном

Попробуйте что-то вроде:

$('#myTable tbody')
    // append a new row clone
    .append($("#dates .tr-shadow:last").clone())
    // append another spacer after the clone
    .append('<tr class="spacer">')