Fix Uncaught ReferenceError: $ is not defined in jQuery

Today in this post I am going to tell you how to fix a common jQuery error which is “$ is not defined in jQuery”. Many of newbie don’t know why this kind of error occurs. I also have found a question “How to fix Uncaught ReferenceError: $ is not defined in jQuery” many times on the internet.

So today we are going to see how to fix the $ is not defined error in jquery. So let’s continue reading.

jQuery multiple events to trigger same function

Send AJAX request every n seconds using jQuery

Before we directly enter the solution, let’s discuss the reasons that may be responsible for this type of jQuery error. The reasons that may cause this error are given below:

 

1. Try to run jQuery JavaScript code before loading the jQuery file

This is a very common issue. In many times it can be found that the jQuery file includes the JavaScript code. If this happened then the console log will show this type of error.



 

2. Your JavaScript file is not being properly loaded into your page

Sometimes it can be found that your jQuery file is not loaded properly or the wrong path of JavaScript file given. You can use Firebug to check if the JavaScript file is actually being loaded properly. If not, it will be highlighted red and will say “404” beside it.

 

3. You may have botched version of jQuery

In many times it can be found that someone edited or modify the JavaScript code of the core jQuery file. In most of the cases, this is done to compress and minimize the size of jQuery file.

 

4. You have JavaScript running before the page is fully loaded

Sometimes it can be found that the JavaScript code running before the page loading process completely. In this case, also you may get the “Uncaught ReferenceError: $ is not defined” error.

 

Validating phone numbers in JavaScript

Detect arrow key press in JavaScript

So I have discussed the reasons that may be responsible for $ is not defined error in jQuery. Now I am going to discuss how to fix this problem.

Below are the solutions that can solve $ is not defined jQuery error:

 

1. Be sure that your jQuery file included before JavaScript. Otherwise, it will load the JavaScript and it will find the jQuery functions do not exist and then it will show the error. After that error, it will find the jQuery and this is too late then.

 

2. If you have botched version of jQuery then you should go through that jQuery and you should maintain the rules of using the botched jQuery file. Or you can replace it with the proper jQuery file.

 

3. To become sure about page load complete you can use jQuery $( document ).ready() method just like below:

$(document).ready(function(){
    // Put all your JavaScript code here
});

Inside the $( document ).ready() method function put all the javaScript code.

 


 

I hope this post will fix your problem if you also face the problem using jQuery.

Leave a Reply

Your email address will not be published. Required fields are marked *