Функция не вызывается в onclick event

Я хочу добавить несколько HTML в конце каждой ссылки на YouTube, чтобы открыть проигрыватель в litebox. Пока это мой код:

$(document).ready(function() {
  var valid_url = new RegExp('youtube\.com\/.*v=([a-zA-Z0-9_-]+)');
  var image_data = 'base64 encoded image';

  init();

  function init() {
    $('a').each(function() {
      if (valid_url.test($(this).attr('href'))) {
        $(this).after( ' <img src="' + image_data + '" onclick="open_litebox(\'hi\');" />' );
      }
    });
  }

  function open_litebox(param) {
    alert(param);
  }
});

Он работает до такой степени, что вставляет некоторый HTML после ссылки на YouTube, например:

<img src="base 64 data" onclick="open_litebox('hi')">

Но когда Я нажимаю на нее, функция open_litebox () не вызывается. Посмотрев в консоль ошибок, я вижу ошибку, в которой говорится, что open_litebox не определен , но я определил это.

Я совершенно не понимаю, что здесь происходит не так, может кто-нибудь мне помочь?

Спасибо.

29
задан Rory McCrossan 14 August 2017 в 10:13
поделиться