Detect iframe click events with pointer-events

Today I learned about the CSS attribute pointer-events. Used with an iframe and parent div you can detect when a click has been made over an embedded iframe.

<div class="container">
  <iframe></iframe>
</div>
iframe {
  pointer-events: none;
}
$(document).ready(function () {
  $('.container').on('click', function() {
    $(this).after("<p>click detected!</p>");
  });
});