I'm trying to put multiple videos on one page. I tried to give each one an individual id but failed miserably. Also how on earth do I assign a image to each player. My example works with one player only and falls back to HTML5 video with no problems . If I decided on five videos per page, how do I apply an id to each one as well as a different image per player. Here is what I have so far:

Code:
<script type="text/javascript" src="video/swfobject.js"></script> 
<script type="text/javascript"> 
var flashvars = {}; 
flashvars.src = "http://www.mysite.com.mp4"; 
flashvars.controlBarMode = "floating"; 
flashvars.poster = "http://mysite.com/imageonplayer.png"; 
var params = {}; 
params.allowfullscreen = "true"; 
params.allowscriptaccess = "always"; 


var attributes = {}; 
attributes.id = "videoDiv"; 
attributes.name = "myDynamicContent"; 


swfobject.embedSWF("http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf", "videoDiv", "487", "275", "10.1.0","expressInstall.swf", flashvars, params, attributes); 
</script> 
</head>
Code:
<div id="videoDiv"> 
<video controls="controls" poster="http://mysite.com/imageonplayer.png" width="487" height="275"> 
<source src="http://www.mysite.com/mymovie.mp4" type="video/mp4" /> 
<source src="http://www.mysite.com/mymovie.ogg" type="video/ogg" /> 
</video> 
</div>
I tried to assign an id like this but again it didn't work for me:
Code:
<script type="text/javascript"> 
swfobject.registerObject("videoDiv1", "10.1.0"); 
swfobject.registerObject("videoDiv2", "10.1.0"); 
swfobject.registerObject("videoDiv3", "10.1.0"); 
swfobject.registerObject("videoDiv4", "10.1.0"); 
</script>
Any help is appreciated.