JQuery Maximize Element based on Screen Width + Height

HTML

<div id="elementToBeMaximized"></div>

CSS

#elementToBeMaximized {
    
    width: 300px;
    height: 100px;
    background: red;
}

JavaScript

var elem2Max = $('#elementToBeMaximized');
var maxWidth, maxHeight;

//jquery shortcut for when doc ready
$(function(){
  maxWidth = $(window).width();
    
/*note, if document longer than visible viewport area, this will leave some space at the bottom, in which case you would get the full document height by calling the custom function $.getDocHeight()
    */
  maxHeight = $(window).height(); 
 
  elem2Max.css({width: maxWidth, height: maxHeight});              
});

$.getDocHeight = function() {
    return Math.max(
        $(document).height(),
        $(window).height(),
        /* For opera: */
        document.documentElement.clientHeight
    );
  };