Jquery not defined timing issues

Question

I am including jQuery in the head of a personal site. I also included an external js file right after it that uses jQuery.

<script language="javascript" src="../js/jquery-1.4.2.min.js"></script>
<script language="javascript" src="../js/global.js"></script>

global.js merely contains the following:

$(".nav-item").hover(function(){
    $(this).addClass("selected");
},
function(){
    $(this).removeClass("selected");
});

When I tried it out, I was noticing that my error console was giving me a "$ is not defined error". After moving my external js file to the bottom of the page, everything works fine. What is the proper way to deal with what is apparently a timing issue?

Thanks in advance for any help

EDIT: It seems that while I did see the undefined error last night, I must have done something to get rid of it and am not able to see or reproduce it anymore. I tried binding the events to document.ready, and that seems to solve my problem.

Answer 1

Did you bind the event handler in global.js to document ready?