IE8 Error on dynamic insertion of video tag

[GoogleCodeExporter]

What steps will reproduce the problem?
1. Load jquery.js and jquery.html5.min.js
2. Try dynamically inserting video
3.

What is the expected output? What do you see instead?
Expect a video to be embedded in ie8. I get the error

What version of the product are you using? On what operating system?
WinXP IE 8.0.6001.18702

'undefined' is null or not an object  jquery.html5media.min.js, line 31
character 433

Please provide any additional information below.
Here's the link:
http://test.webbdesign.com/html5/video.html

Here's the code:
$(document).ready(function(){
             var vid='<video class="video" poster="cat.jpg" width="352"
height="264" controls preload><source src="cat.ogv" type=\'video/ogg;
codecs="theora, vorbis"\'></source><source src="cat.mp4" type=\'video/mp4;
codecs="avc1.42E01E, mp4a.40.2"\'></source></video>';
             $('#wrap').append(vid);
             html5media();
           });

Original issue reported on code.google.com by bennyb...@gmail.com on 21 Apr 2010 at 12:18

[GoogleCodeExporter]

I think that your problem is almost certainly due to IE8's HTML parsing.  The 
HTML code for your video tag is 
being munged before being inserted into the page.

Try doing it this way instead:

var vid = $("<video/>").attr("class", "video").attr("poster", 
"cat.jpg").attr("width", "352").attr("height", 
"264").attr("controls", "controls").attr("preload", "auto");
var src1 = $("<source/>").attr("src", "cat.ogv").attr("type", 'video/ogg;
codecs="theora, vorbis"');
var src2 = $("<source/>").attr("src", "cat.mp4").attr("type", 'video/mp4;
codecs="avc1.42E01E, mp4a.40.2"');
vid.append(src1).append(src2);
$("#wrap").append(vid);

This way, IE is left with no ambiguity as to how the HTML should be parsed. In 
your case, the HTML is being 
parsed by IE as six different nodes with no nesting, which is complete garbage.

N.B. I haven't testing the JS, but you should get the general idea. Use jQuery 
DOM methods to create the HTML 
rather than passing in a HTML string.

Original comment by david.et...@gmail.com on 21 Apr 2010 at 11:13

• Added labels: Type-Other
• Removed labels: Type-Defect

[GoogleCodeExporter]

This was almost certainly a bug in IE8, and it's cluttering up the issues list.

Original comment by david.et...@gmail.com on 7 May 2010 at 10:38

• Changed state: Done