title: Dynamic height based on viewport height
body: <p>I have the following code which resizes the height of a targeted element
  but it only works with resize event, not when the page is loaded.
  What could be the flaw here that doesn't set the height dynamically with the page load?</p>
  
  <p>I'd also like to know how I can make the iterated codes into a modular structure in
  this scenario.  </p>
  
  <pre><code>$(window).resize(function() {
      var viewportHeight = $(window).height();
      var search = $(#something).outerHeight();
      $(".k-grid-content").height(viewportHeight - (400 - search));
  });
  
  $(function () {
      var viewportHeight = $(window).height();
      var search = $("#something").outerHeight();
      $(".k-grid-content").height(viewportHeight - (400 - search));
  });
  </code></pre>