JSFiddle - React, Tailwind, and code Playground

HTML

<video id="video1" width="420" controls>
    <source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4" />
    <source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg" />Your browser does not support HTML5 video.</video>

<button onclick="PlayFunction();">PLAY</button>

JavaScript

$(document).ready(function () {   
    //PlayAudio();
    


});

function PlayFunction()
{
        launchFullScreen(document.getElementById("video1")); // any individual element);
    $("#video1")[0].play();
    
}



function launchFullScreen(element) {  
      if (element.requestFullScreen) {
        element.requestFullScreen();
    } else if (element.mozRequestFullScreen) {
        element.mozRequestFullScreen();
    } else if (element.webkitRequestFullScreen) {
    
        element.webkitRequestFullScreen();
    }
    else if (element.msRequestFullscreen) {
        element.msRequestFullscreen();
    } else if (element.webkitRequestFullscreen) {
    
        element.webkitRequestFullscreen();
    } else {

        alert("no cai en ningun lado");
    }
}

var audioFiles = ["http://amebaproducciones.com/mp3/t1.mp3", "http://amebaproducciones.com/mp3/t2.mp3"];


function PlayAudio() {
    var trackCount = audioFiles.length;
    if (audioFiles.length > 0) {
        var music = new Audio(audioFiles[0]); 
        
        var index = 0;        
        var audio =  $(music).bind('ended', function () {
            if ((index + 1) < trackCount) {
                index++;
                loadTrack(index);
            } else {
                audio.stop();
            }
        });
        var loadTrack = function (id) {
            index = id;
            music.src = audioFiles[id];
            music.play();
        };
        music.play();
        
    }


}