html5 video playing twice (audio doubled) with JQuery .append()

Maybe jQuery caches the content of $() before appending it to your player div? So there is another instance of the video tag. It could be an error in jQuery. Have you tried this without Jquery/js?

I would try adding the autoplay attribute after you append the video player. This should then instantiate the play function.

That would be something like this:

var v = $("<video id='v' src='videofile.webm' autobuffer='auto' preload controls></video>");$("#player").append(v);v.attr('autoplay','autoplay');

When you create elements in JavaScript i.e. image elements, objects etc, they are loaded instantly and stored in memory as objects. That is why you can preload images before you load a page. It is therefore not a jQuery bug.

Ref: http://www.w3.org/TR/html5/video.html#attr-media-autoplay

When present, the user agent (as described in the algorithm described herein) will automatically begin playback of the media resource as soon as it can do so without stopping.

I've got the same problem over here. This seems to be an issue with using the "autoplay" attribute on your video markup.

• Remove the autoplay attribute
• append your video DOMNode to any node
• if you want autoplay behavior, call videodomnode.play() - using jquery this would be $('video')[0].play()