Why doesn't the jt-jb youtube javascript code work in the jquery document?

Question

Youtube Javascript API outside jQuery ready function: http://jsbin.com/umituf/1

Inside the jQuery ready function: http://jsbin.com/umituf/2

I would like to use jQuery because when the video is stopped ( even === 0 ) and loadmore() method is called, I want to write an ajax call in jQuery in order to return to the server and get more video ID so that they can be further passed to cuePlaylist(...) method.

Why can't I mix jQuery and API and how can this be done?

Answer 1

Functions must be defined in a global area.

http://jsbin.com/umituf/3

Edit to clarify:
The Youtube api script is looking for these specific functions in a global area. The api script does not have access to the scope created in the document.ready callback.

Answer 2

youtube api js-code that you attach to the page, use the global context. You can put your code in

 $(document).ready(function(){ window.onYouTubeIframeAPIReady = onYouTubeIframeAPIReady; }); 

But in the end you should write this line (*).

After that, the onYouTubeIframeAPIReady function will be accessible from the global context.