variable assignments using jQuery failing in Safari?

Question

I'm using jQuery 1.3.2 and it's breaking under Safari 4 for mysterious reasons.

All of my javascript references are made right before the tag, yet with the following code:

var status = $('#status');

status.change( function(){ /* ... */ } );

The following error is displayed in the Web Inspector:

TypeError: Result of expression 'status.change' [undefined] is not a function.

However the error is not encountered if I eliminate the variable assignment attach the change method directly like so:

$('#status').change( function(){ /* ... */ } );

Why? I need to use variables for this and several other findById references because they're used many times in the script and crawling the DOM for each element every time is regarded as bad practice. It shouldn't be failing to find the element, as the javascript is loaded after everything except and .

Answer 1

Try changing the variable to something other than "status."

It's confusing your variable with window.status (the status bar text). When I typed var status = $('#status') into the debugging console, the statusbar changed to [Object object]. Must be a bug in Safari.

If you put the code inside a function, so that status becomes a function-local variable, it should work.

Answer 2

It's standard practice in jQuery to wrap things in a

$.onready(function() {

});

This makes sure the DOM is loaded before you try to manipulate it.