title: Execute Javascript function after youtube video end
body: <p>I am loading up a youtube video through the youtube API, as I want to execute a line of jQuery when the video ends. For some reason my code will not execute, can someone point me in the right direction...</p>
  
  <p>First I embed the iFrame</p>
  
  <pre><code> &lt;iframe id="player" class="blo" width="219" height="207" src="http://www.youtube.com/embed/qNL81Khx_UE?enablejsapi" frameborder="0" allowfullscreen&gt;&lt;/iframe&gt;
  </code></pre>
  
  <p>Then I create the API Script</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
            // 2. This code loads the IFrame Player API code asynchronously.
            var tag = document.createElement('script');
            tag.src = "http://www.youtube.com/player_api";
            var firstScriptTag = document.getElementsByTagName('script')[0];
            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
  
            // 3. This function creates an &lt;iframe&gt; (and YouTube player)
            //    after the API code downloads.
            var player;
            function onYouTubePlayerAPIReady() {
              player = new YT.Player('player', {
                height: '390',
                width: '640',
                videoId: 'qNL81Khx_UE',
                events: {
                  'onReady': onPlayerReady,
                  'onStateChange': onPlayerStateChange
                }
              });
            }
            &lt;/script&gt;
  </code></pre>
  
  <p>Then I make a function</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
   var myPlayerState;
    function onPlayerStateChange(event) {
      if (event.data == YT.PlayerState.PLAYING &amp;&amp; !done) {
        alert('Something Happened');
      }
      myPlayerState = event.data;
       }
  
  if (myPlayerState == 1){
  alert('Something Happened');
  }
  </code></pre>
  
  <p></p>
  
  <p>Can anyone let me know what I am doing wrong?</p>
  
  <p>Thanks!</p>