Pausing video doesn't stop audio in html5 video tag

I had a similar issue which was resolved with really wonderful coders. Check out this post. It might be of great use. HTML5 Video Controls do not work

If you are using html attribute:

<video id="yourvideoID" poster="Pic.jpg" loop autoplay controls width="100%">
<source src="//example.website/InnovoThermometer.mp4" type="video/mp4">        
</video>

Remove autoplay.

Then use jquery to use autoplay instead:

$(document).ready(function() { $("#bigvid3").get(0).play(); });

As for the source there are multiple locations: html5 video playing twice (audio doubled) with JQuery .append()

and

Auto-play an HTML5 video on Dom Load using jQuery

My guess would be that showVideo is being called twice some how and creating two copies, one of which keeps playing even after you call pause on the other.

In your code, the videoplayer var won't refer to the video tag you create later with append, it will point to whatever had that id before, which I'm assuming gets removed when you empty the box, but might stick around in memory (and continue to play sound).

Just my best guess, but either way it'd be better to use the video element's API to set the source and other parameters rather than emptying the box and rebuilding the tag.

videoplayer.src = video.Location;
videoplayer.autoplay = true;
// etc.

Also, 100% isn't a valid value for the width/height attributes. You'll need to use CSS to make the video stretch to fill an area.