go fullscreen on click (cross-browser) - with a single button

fullscreen.js

$('.fullscreenbutton').on('click', function () {

    function toggleFullScreen() {
        if (!document.fullscreenElement &&    // alternative standard method
            !document.mozFullScreenElement && !document.webkitFullscreenElement) {  // current working methods
            if (document.documentElement.requestFullscreen) {
                document.documentElement.requestFullscreen();
            } else if (document.documentElement.mozRequestFullScreen) {
                document.documentElement.mozRequestFullScreen();
            } else if (document.documentElement.webkitRequestFullscreen) {
                document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
            }
        } else {
            if (document.cancelFullScreen) {
                document.cancelFullScreen();
            } else if (document.mozCancelFullScreen) {
                document.mozCancelFullScreen();
            } else if (document.webkitCancelFullScreen) {
                document.webkitCancelFullScreen();
            }
        }
    }

    toggleFullScreen();
});

// change icons and position
function toggleState() {
    $('.fullscreenbutton')
        .toggleClass('enterfullscreen')
        .toggleClass('exitfullscreen');
}
// hide header and footer
function toggleEverythingButArrows() {
    $('#header').slideToggle('slow');
    $('#footer').slideToggle('slow');
}

// event listeners

document.addEventListener("fullscreenchange", function () {
    //document.fullscreen ? console.log(1) : console.log("no");
    toggleState();
    toggleEverythingButArrows();
}, false);

document.addEventListener("mozfullscreenchange", function () {
    //document.mozFullScreen ? console.log("moz") : console.log("not moz");
    toggleState();
    toggleEverythingButArrows();
}, false);

document.addEventListener("webkitfullscreenchange", function () {
    //document.webkitIsFullScreen ? console.log("webkit") : console.log("not webkit");
    toggleState();
    toggleEverythingButArrows();
}, false);