jQuery $ is not a function in Firefox, works in Chrome and works with $(document).ready()

Question

Hello,

I'm implementing jQuery in a site and am getting the "$ is not a function" in Firefox when I try to use a selector, but $(document).ready() works perfectly right before it. My code looks like this

<script>
     $(document).ready(function(){
          alert("hi")
     }); // Works fine
     function showDiv(){
          $("#traditionalCC").hide();
     }
     //Throws error
</script>

Does anyone know why this happens, and why it works in Chrome and Firefox.

Answer 1

Try

<script> 
   $(function() {
      alert("hi") 
    }); // Works fine 
    function showDiv(){ 
      $("#traditionalCC").hide(); 
    } 
    //Throws error 
</script> 

Answer 2

Try to use

$(document).ready(function() {
      $ = jQuery.noConflict();
});

Fix your script declaration to <script type="text/javascript">

Verify if your script is after the jQuery lib include.

I hope it help.

Answer 3

The key difference between your two examples (the working and non working ones) is that the first one is using the document ready event. That happens when the page is fully loaded. Not sure when you're other one is getting invoked, but my guess is that it is being called before your <script> tag include for jquery.js itself.

Answer 4

I have found that sometimes Firefox gets "hosed" and I have to quit and relaunch.

Answer 5

In case anyone comes across this in the future, the problem was FireBug. I uninstalled and reinstalled and the issue went away.