I'm having trouble with jQuery and Mozzila Firefox. Everything is working just fine in Chrome, but somehow Firefox does not see jQuery.

This is how I call jQuery

 <!-- Favicon and touch icons -->
    <link rel="shortcut icon" href="assets/ico/favicon.png">


    <script src=".11.3/jquery.min.js"></script>
    <link rel="stylesheet" href=".3.5/css/bootstrap.min.css">
    <script type="text/javascript" src="assets/bootstrap/js/datepicker.js"></script>

And this is where it fails (error is: ReferenceError: $ is not defined):

 <script>
        function ajax_check(){

            var id = $("#xml_select").val(); // this is the line where I get error

             $.ajax({
                    url: "ajax_check.php?id="+id,
                    success: function(response) {

                        var result = jQuery.parseJSON(response);

                       //console.log( JSON.stringify(result['ncp'].replace('"','')) );

                       var ncp = JSON.stringify(result['ncp']);
                       var id = JSON.stringify(result['id']);


                       $("#racun").val(ncp.substring(1,12));

                       $("#id_podnosilac").val(id.substring(1,5));
                    }, 
                  });

        }
</script>

Please help, what could be causing this?

I'm having trouble with jQuery and Mozzila Firefox. Everything is working just fine in Chrome, but somehow Firefox does not see jQuery.

This is how I call jQuery

 <!-- Favicon and touch icons -->
    <link rel="shortcut icon" href="assets/ico/favicon.png">


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <script type="text/javascript" src="assets/bootstrap/js/datepicker.js"></script>

And this is where it fails (error is: ReferenceError: $ is not defined):

 <script>
        function ajax_check(){

            var id = $("#xml_select").val(); // this is the line where I get error

             $.ajax({
                    url: "ajax_check.php?id="+id,
                    success: function(response) {

                        var result = jQuery.parseJSON(response);

                       //console.log( JSON.stringify(result['ncp'].replace('"','')) );

                       var ncp = JSON.stringify(result['ncp']);
                       var id = JSON.stringify(result['id']);


                       $("#racun").val(ncp.substring(1,12));

                       $("#id_podnosilac").val(id.substring(1,5));
                    }, 
                  });

        }
</script>

Please help, what could be causing this?

• javascript
• jquery
• css
• google-chrome
• firefox

• what error you are getting? – Parth Trivedi Commented Dec 15, 2015 at 10:17
• Maybe just FF browser's cache issue... Because otherwise, your code would work. – A. Wolff Commented Dec 15, 2015 at 10:18
• make full request Ctrl +F5 – Parth Trivedi Commented Dec 15, 2015 at 10:18
• You should mention the error too! – Rayon Commented Dec 15, 2015 at 10:20
• @RayonDabre (error is: ReferenceError: $ is not defined) – A. Wolff Commented Dec 15, 2015 at 10:20

5 Answers 5

You will get this error randomly based on loading time/different browsers. Because Root cause of this is that you are loading jquery.min.js from googleapis. Third party domain resources will get low priority than the local domain resources. "document ready" function statements will be triggered once the local domain resources are loaded. That is why you get this error.

Permanent Solution: Put jquery.min.js file in your server and call it from your domain. this solution will work even if your page has load time issues and in any browser.

Solution found by A.Wolf

Firefox started to work fine when i made couple of full requests(ctrl+f5) as A.Wolf suggested.

This problem persists even 3 years later. some people use jquery just for the $ function which is ridiculous. One could program it oneself.

$ = document.getElementById or ByClass there are many ways to search within the DOM and new ones that are appearing.

I had the problem of assigning functions for when the document was loaded which was solved by this question here

use "jQuery" word (with out qutation) instead of $ in your code

as suggested by A.Wolf. You need to press 'ctrl+f5' key. Sometimes it happens due to cache. Use 'ctrl+shift+delete' and clean the browser cache then run your code.