I'm trying to dynamically spawn a video element on a page using JavaScript.
JavaScript
<script type="text/javascript">
$(document).ready(function() {
var video = $(document.createElement('video'))
.attr('id', 'VideoElement')
.attr('controls', 'controls')
.attr('src', 'videopath.mp4') // Changed 'href' attribute to 'src'
.css({
width: 640,
height: 360
});
$('#VideoContainer').append(video);
});
HTML
<body>
<div id="VideoContainer"></div>
</body>
In Firefox I get the video harness, but the actual video doesn't load. In IE8 the video harness doesn't even appear.
Is HTML 5 just not supported enough to accomplish this yet?
Edit: Got this to work with Artiom's fix. Looks like this works fine with Chrome and Safari. I'm using a codec Firefox doesn't support, so it doesn't work there; although I suspect it will work with a supported codec. IE8 sure enough doesn't work (high five IE).