JQuery Replaces Iframe Multiple Times
<p>If you take a look at <a href="http://mountainfoodstorage.com/index.php/media" rel="nofollow">this page here</a>, you'll see that I've created a bit of a Youtube video gallery. When it works, it should replace the video in the main section of the page (at the top) with the thumbnail that is clicked and the text on the right is also replaced with text related to that video.</p>

<p>The text replacement seems to be working perfectly but I'm experiencing an issue where during the swap, the iFrame seems to be getting placed multiple times and so the video plays 2-3 times.</p>

<p>The Javascript is below -- is this something I've missed?</p>

<pre><code>&lt;script&gt;
function replaceVideo(id) {
  originalSrc = jQuery("iframe", "#" + id).attr("src");
  autoPlay = originalSrc + "&amp;autoplay=1";
  jQuery("iframe", "#" + id).attr("src", autoPlay);
  video = jQuery(".video-wrap", "#" + id).html();
  jQuery(".flex-video").html(video);
  text = jQuery(".video-description", "#" + id).html();
  jQuery(".vid_desc").html(text);
  jQuery("iframe", "#" + id).attr("src", originalSrc);
}

jQuery(".video-list li").click(function() {
  id = jQuery(this).attr("id");
  replaceVideo(id);
});

    jQuery(window).load(function() {
  if(window.location.search.substring(1)) {
        element = window.location.search.substring(1).split('&amp;');
        if (document.getElementById(element[0])) {
            document.onload = replaceVideo(element[0]);
        }
    }
});
&lt;/script&gt;
</code></pre>

<p>Thanks!</p>
