Это то, что происходит при событии:
$('div#pages').append($('<div class="page" id="test">...</div>'));
И затем, в другом случае это не удается:
var page = $('div.page#test'); // returns empty array
Я отлаживал, и добавленный html появляется в структуре документа после добавления, но не может быть выбран. Выполнение этого же в консоли браузера отлично работает.
В чем может быть проблема?
Используйте .find() http://api.jquery.com/find
var page = $('div#pages').find('div.page#test');
Имел ту же проблему, обнаружил, что если бы я добавил слушателя перед добавлением div, он не нашел бы div. Не забудьте добавить слушателя после создания объекта.
Мне пришлось использовать хак, чтобы обойти эту проблему недавно, когда я динамически вставлял элементы <select>. Я изменил это:
var $item = $('#appendedItem1'); // returns: []
:
var $item = $(document.getElementById('appendedItem1')); // returns: [select#appendedItem1]
Я знаю, что похоже, что это должно быть то же самое, но работает только второй.
пропущенные кавычки в имени класса page
Также пропустили ) для append()
Должно быть
$('div#pages').append($('<div class="page" id="test">...</div>'));
вместо
$('div#pages').append($('<div class=page id="test">...</div>');