title: Working with onStateChange of Youtube player
body: <p>I was trying to use the <code>onStateChange</code> property of Youtube videos, And I could not get it to work. I searched a lot over it but could not really understand how it works. Here is the code which I tried, I added a console.log, which does not get called. Can someone help me?</p>
  
  <p>This is my code:</p>
  
  <pre><code>    &lt;script type="text/javascript"&gt;
          function onYouTubePlayerReady(playerId) {
              var player = document.getElementById("YTplayer");
              player.addEventListener("onStateChange", "onplayerStateChange");
          }
  
          function onplayerStateChange(newState) {
              console.log('test');
          }
      &lt;/script&gt;
          &lt;object style="height: 390px; width: 640px"&gt;
              &lt;param name="movie" value="http://www.youtube.com/v/u1zgFlCw8Aw?version=3"&gt;
              &lt;param name="allowFullScreen" value="true"&gt;
              &lt;param name="allowScriptAccess" value="always"&gt;
              &lt;embed 
                  src="http://www.youtube.com/v/u1zgFlCw8Aw?version=3" 
                  type="application/x-shockwave-flash" 
                  allowfullscreen="true" 
                  allowScriptAccess="always" 
                  width="640" height="390"
                  id="YTplayer"&gt;
          &lt;/object&gt;
  </code></pre>