Dynamically Swap Youtube Video Without Page Reload

Here is what my html page looks like (test):

<div style="width: 640px;">
<object width="640" height="385"><param class="movie" name="movie" value="http://www.youtube.com/v/zkd5dJIVjgM"></param><param name="allowFullScreen" value="true"></param><param name="allowscrip开发者_开发百科taccess" value="always"></param><embed src="http://www.youtube.com/v/zkd5dJIVjgM" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed></object>
<ul>
    <li><a class="btn" href="http://www.youtube.com/watch?v=n3gYWBu1NDI">Video 1</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=7o53S5JROfg">Video 2</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=e2ZB-1kDOdQ">Video 3</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=d-PDXAcUw0s">Video 4</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=vCH8O1dLSbc">Video 5</a></li>
    <li><a class="btn" href="http://www.youtube.com/watch?v=Q8kLlNt3Ue4">Video 6</a></li>
</ul>
</div>

and my jquery looks like this:

$('.btn').click(function(e){
e.preventDefault();
var val = $(this).attr("href");
$('embed').attr('src', val);
});

What i would like to do is be able to click on each link in the list items and have that video repalce the current video that is there. So each click will result in a different video occupying the video at top. Can anyone help?

---

I don't know if you solved it or not, anyway the problem may be that the URL in the VALUE attribute of the PARAM tag has a different format than the one specified in the HREF attribute.

<param class="movie" name="movie" value="http://www.youtube.com/v/zkd5dJIVjgM">
<a class="btn" href="http://www.youtube.com/watch?v=n3gYWBu1NDI">

I think you should pass the PARAM tag a string with the proper format, something like

http://www.youtube.com/v/VIDEO_ID_HERE

Actually I've not tested this, but you can give it a try.

---

What you have should work if you add:

$('param[name=movie]').attr('value', val);