A simple method to stop YouTube, Vimeo, and HTML5 videos from playing.

stop-video.js

/**
 * Stop an iframe or HTML5 <video> from playing
 * @param  {Element} element The element that contains the video
 */
    var stopVideo = function ( element ) {
    element.querySelectorAll('iframe').forEach(function(iframe) {
        if ( iframe.contentWindow ) { /* send stop to content */
            stopVideo(iframe.contentWindow.document);
        }
        else { /* Cross Domain, resetting src is all we can do, and the iframe might fail loading same url */
            var iframeSrc = iframe.src;
            iframe.src = iframeSrc;
        }
    });
    element.querySelectorAll('video').forEach(function(item) { item.pause(); });
    element.querySelectorAll('audio').forEach(function(item) { item.pause(); });
    };
    
    
    // then call from top level document
    stopVideo(document);

Thanks a lot for the code! Do you have an example of using this for the closing of a modal window? (Basically stop a video when closing a modal). I tried a lot of things but am stuck on how to actually getting this to work as a novice in javascript and jquery.

Sorry, didn't try that. if you can get the window then you can close by calling stopVideo(window.document)

Hy, i tryed to call the stopVideo(document); in a click-event for a button to pause all videos on page, but it doesn't work. Error on row 7 of the script. "iframe was not found". Any Idea? Thanks and best regards.

aww... change the line 6 forEach(function(item) to forEach(function(iframe) should solve the problem
the correct var name in the foreach.
Updated to the gist, Thank you!

it won't work with YouTube iframe.contentWindow.document - this won'r pass XSS

To the best of my knowledge, if resetting iframe src does not work(iframe contains autoplay video), there is no way to do this.