Jquery не видит динамические данные

На сайте с помощью ajax подгружаю в html страницу другие html файлы. Jquery код не видит подгруженные элементы. Кто-нибудь сталкивался с таким? Как можно решить данную проблему?

Как один из примеров, есть функция валидации формы

function validateForms(form) {
        $(form).validate({
            rules: {
                name: {
                    required: true,
                    minlength: 2
                },
                phone: "required",
                email: {
                    required: true,
                    email: true
                }
            },
            messages: {
                name: {
                    required: "Пожалуйста, введите ваше имя",
                    minlength: jQuery.validator.format("Пожалуйста, введите {0} буквы!")
                },
                phone: "Пожалуйста, введите свой номер телефона",
                email: {
                    required: "Пожалуйста, введите вашу почту",
                    email: "Неправильно введен адрес почты"
                }
            }
        });
    }

Форма к которой она привязана появляется на странице динамически. Вызов функции validateForms("#consultation-form2"); не срабатывает. Как сделать, что бы работало?


$.ajax({
  url : "./database/getFooter.php", 
  dataType: "html"
}).done(function(result) { 
  $('body').after(result);
});

Также использовал конструкцию

$.ajax({
  url : "./database/getFooter.php", 
  dataType: "html"
}).done(function(result) { 
  $('body').after(result);
    function validateForms(form) {
            $(form).validate({
                rules: {
                    name: {
                        required: true,
                        minlength: 2
                    },
                    phone: "required",
                    email: {
                        required: true,
                        email: true
                    }
                },
                messages: {
                    name: {
                        required: "Пожалуйста, введите ваше имя",
                        minlength: jQuery.validator.format("Пожалуйста, введите {0} буквы!")
                    },
                    phone: "Пожалуйста, введите свой номер телефона",
                    email: {
                        required: "Пожалуйста, введите вашу почту",
                        email: "Неправильно введен адрес почты"
                    }
                }
            });
        }

  validateForms("#consultation-form2");
});

Не работает


Ответы (1 шт):

Автор решения: Igor

Назначайте события подружаемым элементам после их подгрузки или используя делегирование.

$(document).on('click', 'selector for dynamic elements', function(e) {
  // ...
});

$.ajax({
  url : "./database/getFooter.php", 
  dataType: "html"
}).done(function(result) { 
  $('body').after(result);
  validateForms("#consultation-form2");
});
→ Ссылка