youtube's embeded video wont go behind other elements

Question

I have a site that has YouTube's embedded video in it, my problem is, these videos don't obey the z-index rules. All the YouTube videos are displayed on top of all other elements. I tried

$('iframe','.video_container').attr('wmode','opaque');
$('iframe','.video_container').attr('z-index','1');

I found that the wmmode has to be changed to opaque, but isn't this for the old embedded videos?? How do i achieve this for both old embedded style videos and the new iframes??

Edit: Even this didn't work on old embedded videos

$('object','.video_container').append('<param name="wmode" value="opaque"></param>').find("embed").attr('wmode', 'opaque');

this works on iframe videos

var src=$('iframe','.video_container').attr('src');
 if(src.indexOf('?')==-1)
 {
  src=src+'?wmode=transparent';
 }
 else
 {
  src=src+'&wmode=transparent';
 }
 $('iframe','.video_container').attr('src',src);

but i still haven't found a way for old embed videos This is the resultant code after manipulating using js that doesn't work

<object width="320" height="240">
<param name="movie" value="http://www.youtube.com/v/-SNytfkJD4U?version=3&hl=en_US&rel=0"/>
<param name="allowFullScreen" value="true"/>
<param name="allowscriptaccess" value="always"/>
<embed src="http://www.youtube.com/v/-SNytfkJD4U?version=3&hl=en_US&rel=0" type="application/x-shockwave-flash" width="320" height="240" allowscriptaccess="always" allowfullscreen="true" wmode="opaque"/>
<param name="wmode" value="opaque"/>
</object>

Answer 1

just alter your iframe src like this

http://www.youtube.com/embed/UUeRCDyVspR2M?wmode=transparent

so the flashplayer served by google will render like you told em with that parameter :)

you simply have to add ?wmode=transparent to the params or do it like this

http://www.youtube.com/embed/UUeRCDyVspR2M?param1=bla&param2=foo&and_so_on=more&wmode=transparent

so you simply have to append

&wmode=transparent

to the end of the url