element.RequestFullScreen() & element.msRequestFullScreen() is not showing for I.E and Microsoft Edge

Question

Background Information:

Each video thumbnail image when clicked will play the video in full-screen, compatible with cross-browsers

What has been done:

Have created the following source code attached below

Issue:

The video can be played in full-screen for Chrome, however, the video cannot be played for both I.E and Microsoft Edge

See source code below:

$("#MainVideo").data("number", Video);
console.log($("#MainVideo").data("number")); 
var element = document.getElementById("MainVideo");       
if (element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
} else if (element.webkitRequestFullScreen) {
    element.webkitRequestFullScreen();
}else if (element.msRequestFullScreen) {
    element.msRequestFullScreen();
}  else if (element.RequestFullScreen) {
    element.RequestFullScreen();
}    


//This shouldnt affect
$('#MainVideo').bind('webkitfullscreenchange mozfullscreenchange fullscreenchange', function(e) {

var state = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen;
var event = state ? 'FullscreenOn' : 'FullscreenOff';
if (event == 'FullscreenOn') {

}
else if (event == 'FullscreenOff') { 

    console.log($("#MainVideo").attr("src"));

    var playVideo =  videoNameArray[VideoPlaying -1];   
    console.log("playVideo:" + playVideo);
    var mainvideo = document.getElementById("MainVideo");
    mainvideo.pause();
    mainvideo.currentTime = 0;
    mainvideo.src= "";
}
});

Could it be there the versioning of browser be not be supported? or am I missing codes to allow video to play on both IE and Edge?

Answer 1

Capitalization Errors

   else if (element.msRequestFullScreen) {
        element.msRequestFullScreen();
    }

should be

else if (element.msRequestFullscreen) {
    element.msRequestFullscreen();
}

and

else if (element.RequestFullScreen) {
    element.RequestFullScreen();
} 

should be

else if (element.requestFullscreen) {
    element.requestFullscreen();
}