php - YouTube API, jQuery attr won't swap element attributes -

javascript (jquery)

function display_youtube(new_url) {     $('#movie_url').removeattr('value');     $('#embed_url').removeattr('src');     $(document).ready(function() {         $('#movie_url').attr('value', new_url);         $('#embed_url').attr('src', new_url);         $('#shade').css('display', 'block');         $('#youtube_player').css('display', 'block');         $('#exit_youtube').css('display', 'block');     }); } 

html

<object width="720" height="480"> <param id="movie_url" name="movie" value="http://www.youtube.com/v/_eatocsn7yu?f=user_uploads&app=youtube_gdata&autoplay=0" /> <param name="allowfullscreen" value="true" /> <param name="allowscriptaccess" value="always" /> <embed id="embed_url" src="http://www.youtube.com/v/_eatocsn7yu?f=user_uploads&app=youtube_gdata&autoplay=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="720" height="480" /> </object> 

hyperlink

<a href="javascript:display_youtube('http://www.youtube.com/v/_eatocsn7yu?f=user_uploads&app=youtube_gdata&autoplay=1');">click here fun!</a> 

what i've done parsed youtube's api videos on user channel.

the hyperlink above php generated, meant trigger above javascript function, , swap url attributes contained in ids "movie_url" , "embed_url" works should in ff, ie perform .css commands.

my guess ie doesn't me assigning ids param , embed.

fixed it! new code listed below. issue ie's handling of flash parameters (wouldn't perform async refresh of params object). working fine in ff because embedding video, , not handling object.

new javascript

function display_youtube(new_url) {     $('#object_url').replacewith('<param id="object_url" name="movie" value="' +new_url+ '" />');     $('#embed_url').replacewith('<embed id="embed_url" src="' +new_url+ '" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="720" height="480" />');     $('#shade').css('display', 'block');     $('#youtube_player').css('display', 'block');     $('#exit_youtube').css('display', 'block'); } function exit_youtube() {     $('#object_url').replacewith('<param id="object_url" />');     $('#embed_url').replacewith('<embed id="embed_url" />');     $('#shade').css('display', 'none');     $('#youtube_player').css('display', 'none');     $('#exit_youtube').css('display', 'none'); } 

new html

<object width="720" height="480">     <param id="object_url" />     <param name="allowfullscreen" value="true" />     <param name="allowscriptaccess" value="always" />     <embed id="embed_url" /> </object> 

i think trick here force ie rely on instructions jquery before perform actions whatsoever on object, in effect preventing ie caching parameters start. ftw!