Catch the load event from iframes, using jQuery delegation

Question

I want to catch the load even of any iframe which is appended on the document at some point after loading the page.

I tried using on("load", "iframe", fn), but that doesn't seem to do it:

function addIframe() {
  $("<iframe src='https://example.com'>").appendTo($("body"))
}

// This does not work
$(document).on("load", "iframe", function() {
  alert("loaded, caught via delegation")
})

setTimeout(function() {
  addIframe()
  // This works
  $("iframe").on("load", function() {
    alert("Loaded, caught via direct selection")
  })
}, 1000)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

While $("iframe").on("load", fn), right after appending the iframe works, delegation on the document doesn't work.

How can we detect any iframe load from the page using delegation?

Answer 1

How can we detect any iframe load from the page using delegation?

Unfortunately, It is not possible catching the iframe load events via jQuery delegation.