jQuery Forum

I would like to dynamically set a child DIV height to the parent's DIV height, minus the height of another child element. Something like this:

HTML

1. <div id="intro">
   <div id="top-bar"></div>
   <div class="title">sdasfas</div>
   </div>

CSS

1. #intro {
      height: 600px;
   }
   #top-bar {
      height: 180px;
   }

jQuery placed at very bottom of document right before </body> (jQuery library is loaded earlier in the document)

1. <script type="text/javascript">
   $(window).resize(function() {
       var intro_height = $("#intro").height();
       var topbar_height = $("#top-bar").height();
       var final_height = intro_height - topbar_height;
       $(".title").height(final_height);
       var new_h = $(".title").height();
       alert(new_h);
   });
   </script>

However, I'm not seeing any alert on page refresh or on resize, so I'm sure I don't have this set up quite right.