Uncaught ReferenceError: $ is not defined

jQuery is a JavaScript library designed to simplify and enhance JavaScript programming. It indeed aims to make coding tasks more efficient and user-friendly. While working with jQuery, encountering JavaScript errors is a common occurrence, but jQuery provides various methods and techniques to handle and resolve these errors effectively.

What is jquery Uncaught ReferenceError: $ is not defined

The symbol "$" serves as an alias for the jQuery() function. Consequently, attempting to invoke or access it prior to its formal declaration will invariably result in an error message stating that "$" is undefined. This commonly signals an issue with jQuery's absence or JavaScript's inability to recognize the "$" symbol. Even when employing "$(document).ready", the "$" symbol remains undefined, as jQuery has not been loaded at that point in the execution process.

To solve this error:

To ensure that the "$" symbol or "jQuery" is recognized in your scripts, it is advisable to load the jQuery library at the outset of all your JavaScript files. This practice enables the proper identification and utilization of "$" or "jQuery" throughout your scripts, ensuring seamless functionality.


In the following code, you can see that the jQuery library is loaded after the script. So, you will get "$ is not defined" error.

<!DOCTYPE html> <html> <head> <script> $(document).ready(function(){ $("p").click(function(){ alert("You Clicked...."); }); }); </script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> </head> <body> <p>Click Here...</p> </body> </html>

In order to fix this error, include the jQuery library file before the JavaScript code.

<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function(){ $("p").click(function(){ alert("You Clicked...."); }); }); </script> </head> <body> <p>Click Here...</p> </body> </html>
run this source code Browser View

Click Here...

There can be multiple other reasons for this issue:

Working offline

How to solve Uncaught ReferenceError: $ is not defined

In situations where you may find yourself working offline and encountering difficulties loading jQuery from an internet-based Content Delivery Network (CDN) due to connectivity issues, a prudent approach is to download the jQuery.js file and utilize it locally. To achieve this, you can employ the following code snippet to load jQuery from a local source:

<script src="path/to/your/local/jquery.js"></script>

By specifying the correct path to your locally stored jQuery.js file within the src attribute of the <script> tag, you can ensure that jQuery is loaded and utilized locally, mitigating potential connectivity problems associated with CDN-based loading.

Conflict with Other Libraries

jQuery employs the "$" sign as a convenient shorthand, but conflicts can arise when using other JavaScript libraries such as Angular, Backbone, prototype.js, MooTools, and others that also utilize the "$" variable. To circumvent such conflicts and maintain compatibility, you can employ the noConflict() method. This method allows you to continue using jQuery by referencing it with its full name, "jQuery," rather than the "$" shortcut, ensuring smooth coexistence with other libraries:

<script> $.noConflict(); jQuery(document).ready(function(){ jQuery("button").click(function(){ jQuery("p").text("jQuery is still working!"); }); }); </script>

Path to jQuery library you included is not correct

You might have put an incorrect path to jQuery library , or there may be typo in your file.

<script src="ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

The above code does not include the HTTP: or HTTPS: in the src attribute but the browser, FireFox, needed it so you should changed it to:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

The jQuery library file is corrupted

If the jQuery library file has been downloaded from an untrustworthy sites and the file is corrupted, this error may happen.

Download Query CDN

Google CDN:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Microsoft CDN

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>


The error message "Uncaught ReferenceError: $ is not defined" indicates that the symbol "$" is being used in JavaScript code without prior definition, usually occurring when jQuery is not properly loaded or conflicts with other libraries using the same symbol. To resolve this error, ensure jQuery is loaded correctly or consider using the noConflict() method to prevent conflicts with other libraries.