Функция JQuery Click добавляет в DOM, как связать новые вставки?

Question

У меня есть функция, которая копирует значения из таблицы1 в таблицу2.Функция проверяет вторую таблицу, чтобы убедиться, что перед копированием достаточно строк, а если строк недостаточно, она создает их с addRows(n).

$('#copyTableValues').on('click', function() {
    // count available rows and add more if needed
    if(table2Rows < rowsNeeded)
    {
        addRows(rowsNeeded - table2Rows);
    }

    // copy values from table1 to table2
    // ....

});

Однако функция не распознает строки, которые были недавно добавлены с помощью addRows.Если я снова нажму на функцию копирования, она распознает их.

Насколько я понимаю, это связано с тем, что jquery проверяет изменения DOM только во время части .on('click') этой функции.Есть ли способ попросить его проверить еще раз в тех случаях, когда после добавления я добавляю DOM?

Answer 1

Да, вам нужно немного подняться в иерархии.

Попытка:

$('body').on('click', '#copyTableValues', function() {

});

Это будет следить за 'body' любыми добавлениями '#copyTableValues', а также применять событие к ним. То, как вы работаете, обращается только к тем частям, которые уже загружены в DOM, когда скрипт попадает в эти строки.