Очень похожая проблема с Динамически добавленные элементы HTML не могут быть найдены с помощью jQuery, но я хочу получить доступ к данным нового элемента, а не к его событию .

Элемент добавляется JQuery через запрос AJAX. Он не отсутствует в DOM, когда я пытаюсь получить к нему доступ.

<button id="get-data">Get data</button>
<div id="container">
    <!-- everything here is added through the first ajax call -->
    <button id="update-data">Update</button>
    <input type="hidden" id="elem" data-data="someData" />
</div>

Итак, я попытался:

$('#elem').data('data');
$(this).parents().find('#elem').data('data');
$(document).find('#elem').data('data');

...безуспешно.

И это не сработает: JQuery не находит #elem в DOM:

console.log($('input'));
// OR
console.log($(document).find('input'));

...выведите список input элементов в DOM, но #elem нет в этом списке.

Я предполагаю, что я не могу использовать $().find() или прямой $() для получения динамически добавляемого контента, так как мне его получить?

Вот как организован мой JS:

$(function() {
    $('#get-data').click(function() {
        $.ajax({
            url: "/"
        }).done(function() {
            $('#container').html(ajaxResult)
        });
    });
    $(document).on('click', '#update-data', function() {
        $.ajax({
            url: "/new",
            data: $('#elem').data('data')
        });
        //This ajax call doesn't work as expected because data is missing.
        //#update-data is inserted by the first AJAX call, but the click even is catched without any problem here.
    });
});

Изменить после дальнейших исследований:

Я попытался вывести результат разных селекторов JQuery:

$('#container').find('#elem');

Объект JQuery (длина: 0) => prevObject: [input#elem]

$('#container').find('#elem').first();

Объект JQuery (длина: 0) => prevObject : Объект JQuery (длина: 0) => prevObject : [input#elem]

$('#elem');
//or
$(document).find('#elem');
//or
$('#container #elem');

JQueryObject (длина: 0) => предыдущий объект: [ HTMLDocument my_website.com ]

$('#elem').first();
//or
$(document).find('#elem').first();
//or
$('#container #elem').first();

Объект JQuery (длина: 0) => prevObject : Объект JQuery (длина: 0) => prevObject : [ HTMLDocument my_website.com ]