Добавление элемента за элементом с помощью.After() забирает предыдущие добавленные элементы вместе с ними. (JQuery)

Question

У меня есть динамический список, куда я могу добавить поля файла. Но когда я добавляю несколько полей, все добавленные кнопки удаления перемещаются в последнее добавленное поле.

И когда я использую .before() вместо .after() это работает правильно, только это перед элементом, что я не хочу..

Демо - версия:

https://jsfiddle.net/yokLpnwo/11/

Answer 1

Ну, Button добавлены в Dom, это ваша кнопка css на кнопке удаления, которая превращает вашу кнопку в перекрывающиеся друг с другом.

'<button type="button" id="remove' + (next) + '" class="btn btn-danger remove-me"  style="margin-top: -34px; position: absolute; right: 40%;" >-</button></div><div id="field">'

CSS, который вы добавляете с помощью этой кнопки, чтобы ваша кнопка перекрывала друг друга. Изменяет верхнюю границу с соответствующей, чтобы умножить ее на переменную nextкак показано ниже,

'<button type="button" id="remove' + (next) + '" class="btn btn-danger remove-me"  style="margin-top: -'+(next*34)+'px; position: absolute; right: 40%;" >-</button></div><div id="field">'