CODEWITHSUNDEEP
javascriptjquery
AbbyD
AbbyD

Reputation: 61

Select dynamically created elements

I have a page that's contents are loaded from another html file using: var url = 'url.to.page'

fetch(url).catch(error => console.log('Authorization failed : ' + error.message));
$('body').load(url + ' #page-cover, .pre-load, header, .container');

Inside those elements are many other elements with ids and classes already assigned. They all show up when I inspect the page, but I can't select any of them without receiving 'null'. I've tried using: 

document.getElementById("element");

$('[id^="element"]');

$('#element');

I have bound the function that calls this to wait until .load() sends a trigger that it has finished. Am I missing something, or is there a different way that dynamic elements need to be selected?

Upvotes: 1

Views: 77

Answers (1)

charlietfl
charlietfl

Reputation: 171669

Both load() and fetch() are asynchronous

You can access newly loaded content in the load() success callback. 

$('body').load(url + ' #page-cover, .pre-load, header, .container', function(){
  // new elements exist here

});

Upvotes: 1

Related Questions