WEB TUTORIALS
PRACTICE EXAMPLES
HTML REFERENCES
CSS REFERENCES
PHP REFERENCES

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:

<!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:

Bootstrap UI Design Templates Property Marvels - A Leading Real Estate Portal for Premium Properties