How to Fix Uncaught ReferenceError: $ is not defined in jQuery
Topic: JavaScript / jQueryPrev|Next
Answer: Execute Code after jQuery Library has Loaded
The most common reason behind the error "Uncaught ReferenceError: $ is not defined" is executing the jQuery code before the jQuery library file has loaded. Therefore make sure that you're executing the jQuery code only after jQuery library file has finished loading.
Also if you're including the jQuery library file dynamically, inspect the page source using the browser's developer tool to ensure that it is included correctly and at right place.
Let's take a look at the following example to understand how it basically works:
Example
Try this code »<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery - $ is not defined</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
alert("jQuery is working perfectly.");
});
});
</script>
</head>
<body>
<button type="button">Test jQuery Code</button>
</body>
</html>If you're still getting this error there might be some other reasons, for example, if you have a local copy of the jQuery library file it might be edited or corrupted. Download a fresh copy the jQuery library file from the official website or use CDN link as we've used in the above example.
Related FAQ
Here are some more FAQ related to this topic:
- How to determine if variable is undefined or null in JavaScript
- How to check if an object property is undefined in JavaScript
- How to check if a variable exists or defined in JavaScript
