jQuery clone() не клонирует привязки событий, даже с on()

Я думаю, что вы должны использовать эту перегрузку .clone () способ:

$element.clone(true, true);

clone ([withDataAndEvents] [, deepWithDataAndEvents])

withDataAndEvents: логическое значение, указывающее, следует ли копировать обработчики событий и данные вместе с элементами. Значение по умолчанию-false.

deepWithDataAndEvents: логическое значение, указывающее, является ли событие обработчики и данные для всех дочерних элементов клонированного элемента должны быть скопированы. По умолчанию его значение соответствует значению первого аргумента (по умолчанию false).

---

помните, что .on() фактически не привязывает события к целям, а к элементу, которому вы делегируете. Так что если у вас есть:

$('#container').on('click', '.button', ...);

события на самом деле привязаны к #container. При нажатии на кнопку .button элемент происходит, он пузырится до #container элемент элемент, который инициированное событие оценивается по параметру селектора .on() и если он совпадает, то выполняется обработчик событий. Вот как работает делегирование событий.

если вы клонируете элемент # container, вы должны глубоко клонировать события и данные для Привязок, сделанных с помощью .on() для сохранения.

это не было бы необходимо, если бы вы использовали .on() на родителя #container.