jQuery Simple Example

HTML

<script src="//www.addressfinder.co.nz/assets/v2/widget.js"></script>
<div id="test">
  <img src="https://via.placeholder.com/50" />
</div>

CSS

body {
    padding: 5px;
}

label {
    font-weight: bold;
}

input[type=text] {
    width: 20em
}

p {
    margin: 1em 0 0;
}

JavaScript

$(document).ready(function() {
	// does not work
  function onload () {
  	alert('loaded');
  }
  
  // work fine
  $('#test').on('click', 'img', function() {
  	alert('clicked');
  });
  setTimeout(() => {
  	const $img = $('<img src="https://via.placeholder.com/150" />')
    $img.on('load', onload)
  	$('#test').append($img);
  }, 1000);
  setTimeout(() => {
  	const $img = $('<img src="https://via.placeholder.com/250" />')
    $img.on('load', onload)
  	$('#test').append($img);
  }, 2000);
  setTimeout(() => {
  	const $img = $('<img src="https://via.placeholder.com/350" />')
    $img.on('load', onload)
  	$('#test').append($img);
  }, 3000);
});