Как правильно добавить элемент в список JQ?

Question

[konoplitskiy]

Всем привет, есть такая конструкция - список. Мне нужно при клике добавлять в этот список li элемент внутри которого ещё лежит div, c инпутами и кнопкой(удалить этот же элемент из списка при клике). Сделал этот скрипт через клонирование элементов(и думаю что конструкция не совсем правильно реализована).
Задача: При клике на кнопку "Добавить ещё элемент", соответственно добавляется элемент li с его содержимым в список ul.list . При клике на кнопку "удалить" удаляется именно этот элемент. Доходит до первого элемента в списке и останавливает функцию удаление, но при нажатии на кнопку добавить опять же выполняется функция добавления элемента в список. Вот сылочка на то что у меня получилось https://codepen.io/Konoplitskiy/pen/pojoBBP
Может у кого-то есть готовое решение,буду очень благодарен.

Answer 1

[Артем Андреев]

$(document).on('click','.add_element', function(e){
   e.preventDefault();
   let links = $("[data-rebest='yes']").length;

   $('.list').find('.list__item:first').clone(true).attr('id', 'period' + links).prependTo(".list");
})

 $(document).on('click','.remove_element:not(:first)', function(e){
   e.preventDefault();
    $(this).parent().parent().remove();
 });

Comments

[konoplitskiy]

Артем Андреев , спасибо вам огромное.

[Артем Андреев]

konoplitskiy, не за что. Вам осталось разобраться с нумерацией элементов при удалении)