clone добавляет несколько раз

Question

Мне нужно клонировать и добавлять элементы при нажатии кнопки. В первый раз он работает правильно, но на других добавляет клик, он добавляет 2, 4, 8 ... элементов. Я отлаживал элемент непосредственно перед добавлением и содержит одну копию элемента, а событие click срабатывает только один. Так что я спутал немного такого поведения

Fiddle is here

$(document).on('click', '.js-add-faq-row', function(){ 
    var faqc = $('.faqs-container'); 

    // 
    var tl = $('[id *= "content_element_prototype"] .faqs-container .faq-container'); 
    var ctl = tl.clone(); 
    ctl.appendTo(faqc); 
}); 

Answer 1

Это потому, что на каждом присоединять вы добавляете новый .faq-container элемент. Затем, когда вы клонируете, вы захватываете все из них, поэтому вы удваиваете количество элементов при каждом нажатии кнопки. Вместо этого, просто захватить первый один:

var faqc = $('.faqs-container').first(); 

Updated fiddle