In this programming tutorial we will learn how to fix this JQuery - $ is not defined error. There are various reasons behind this error. Let's have a look on those reasons.

JQuery - $ is not defined error

1. You have JavaScript running before the web page is fully loaded, and as such, before jQuery is fully loaded.
2. Your JavaScript file is not being properly loaded into your web page.
3. You might have a botched version of jQuery. This could happen because someone edited the core file, or a plugin may have overwritten the $ variable.

If you have firebug installed then you should also check the net panel to see if the file is actually being loaded properly. If not, it will be highlighted red and will say "404" beside it. If the file is loading properly, that means the issue is number 3.

Please confirm that all the javascript code is being run inside a code block such as:

$(document).ready(function () {
  //your code comes here
});

This will ensure that your code is being loaded after jQuery has been initialized.

One more thing that you must check is that you are not loading any jquery plugins before you load jQuery. Plugins extend the "$" object, so if you load a plugin before loading jQuery core, then you'll get the error you described.

So that's it. This is the way to get rid of this JQuery - $ is not defined nasty error.

I hope you will find this tutorial very interesting.

I love your feedback.