jQuery produces 'undefined' error - am I going mad?

Question

I am trying to dynamically position the footer to the bottom of the user's screen using jQuery. I'm pretty sure the code is correct but I'm getting an 'undefined' message in firequery.

Can anyone see where I'm going wrong?

$(document).ready(function(){

$(function(){
    // Define Min Height for Content based on Window size
    var wrapper = $(window).height();
    var content = $("#content_wrapper");
    var header = $("#header_wrapper").height();
    var footer = $("#footer_wrapper").height();
    // Content Height
    contentHeight = wrapper - header - footer - 279;
    $(content).css("min-height", contentHeight + "px");
});

});

See fiddle here

Answer 1

Check this fiddle: http://jsfiddle.net/gT3EX/5/

A few things:

¶

I don't think your fiddle has jQuery selected under Frameworks & Extensions (the drop-down on the left)

¶

You have double nested your document ready call unecessarily. This:

$(document).ready(function(){
…
});

is basically equivalent to this:

$(function(){
  …
});

This, is redundant:

$(document).ready(function(){

    $(function(){
    …
    });
});

¶

You don't need to wrap content in $() since it's already wrapped when you set var content = $("#content_wrapper"); — to remind yourself use the optional convention var $content = $("#content_wrapper"); so you know which variables are jQuery objects.