Как сгенерировать Div, содержащие таблицы с динамически добавляемыми и удаляемыми строками? - Добавлен JSfiddle

В JSFiddle я пытаюсь динамически генерировать div с помощью javascript. Эти блоки будут содержать таблицы, в которых последние две строки могут быть увеличены с помощью кнопки добавления.

Я пробовал код на скрипке. Функция ins_row () используется для добавления строк в таблицу, которые создаются в div.

Функция addEvent () используется для генерации блоков div.

При нажатии кнопки «Добавить продукт» создается блок div, содержащий таблицу с одной строкой.

При нажатии кнопки добавления последние две строки должны продолжать добавляться в соответствии с количеством нажатий. Если нажать кнопку удаления прямо к div, следует удалить всю таблицу и div.

При нажатии кнопки удаления прямо для сгенерированных строк удаляется только эта строка, а не весь div.

Проблема

Проблема в том, что создаются блоки div с таблицей, но я не мог понять, как добавить строки в таблицу.

См. Здесь в действии

Ожидаемый результат

Примечание: я только что вставил внешний файл JS в столбец javascript приведенного выше скрипта, так как у меня нет ссылки на ресурс.

Текущий вывод

Надеюсь, я представил вопрос понятным, если что-то неясно, дайте мне знать