Multiple iframe embeds using Youtube Player API

Question

The situation:

• I have a page with links to youtube videos

• When a link gets clicked a new iframe is loaded into the page using javascript (without reloading) (see http://developers.google.com/youtube/iframe_api_reference)

• After the video finishes, or the user chooses to close it earlier, I call player.destroy() and the player is removed from the DOM.

All this is working like it should. But then, after the video is removed, it doesn't load up a second iframe anymore. Maybe something needs to be reset before it can load a new video (some javascript object, event listeners, etc)? What can I try?

Answer 1

Solved it! Only with the first video the onYouTubeIframeAPIReady function is called by the youtube API, because after that the IframeAPI remains ready.

So, if you want the first video to run, you have to use new YT.Player() in the onYouTubeIframeAPIReady function. With the second and beyond you can immediately use new YT.Player().