Trying to set image heights using window.innerHeight with Javascript

I'm trying to set the height of three images so that each one of them fits the innerheight of the browser, but I can't get it to work.

Index:

<img id="mindmap" src="~/content/bilder/mindmap02.jpg" />
<img id="mindmap" src="~/content/bilder/mindmap03.jpg" />
<img id="mindmap" src="~/content/bilder/mindmap01.jpg" />

CSS:

width: auto;
display:block;
margin-left: auto;
margin-right: auto;

Script:

function imageHeight() {

    var w = window.innerWidth;
    var h = window.innerHeight;

    if (w > h) {
        document.getElementById("mindmap").style.height = h -50 + "px";
    }
}
imageHeight();
window.onresize = function () {
    imageHeight();
};

Please help me! :(