JSFiddle - React, Tailwind, and code Playground

HTML

<img id="buffer" alt="" />
<img id="video" alt="" />

<button id="start">Start</button>

CSS

#buffer {
    position: absolute;
    left: -9999px;
}

#video {
    display: block;
}

JavaScript

$.ajax({
    url: 'http://stackauth.com/1.0/sites',
    dataType: 'jsonp',
    cache: true,
    jsonp: 'jsonp',
    success: function(data) {
        var sites = data.api_sites;
        
        $('#start').attr('disabled', false).toggle(function(){
            $(this).text('Stop');
            
            $('#buffer').load(function(){
                $('#video').attr('src', this.src);
                this.src = sites[Math.floor(Math.random() * sites.length)].logo_url + '?cache=' + new Date().getTime();
            }).trigger('load');
        }, function(){
            $(this).text('Start');
            $('#buffer').unbind();
        });
    }
});