5 Easy Ways to Fix the “jQuery is Not Defined” Error

Whether you’re a stranger to WordPress errors or not, being met with “jQuery is not defined” while working on your website is never fun. It can be a startling and confusing message to see. Luckily, this is a standard error that sites using jQuery may experience at some point or another.

Perhaps your site is down, and when you check your browser console for errors, you see “jQuery is not defined.” Finding the error is the first step — so well done!

The next step is to resolve it. Because this is one of the more straightforward JavaScript errors to fix, it shouldn’t take you very long at all.

In this post, we’ll walk you through everything you need to know to fix it fast. That includes what the error means, why it may have happened in the first place — all critical information to prevent this error in the future. Finally, we’ll walk you through a few steps you can take to resolve it.

Let’s dive in!

What Is the “jQuery Is Not Defined” Error?

The handy console log in your browser is where you’ll probably discover this error. But it’s not incredibly descriptive. What does “jQuery is not defined” actually mean?

In plain English, this error is trying to tell you that something on your site — may be a plugin — requires jQuery to function on your site. For some reason, when the browser tried to load the website and called for that specific jQuery, it was not available.

This error can potentially shut down your site to visitors. Because roughly 78% of the websites on the internet run on jQuery, this is a common error to find.

jQuery is not defined” error in the console log.

Whether you’re a stranger to WordPress errors or not, being met with “jQuery is not defined” while working on your website is never fun. Learn how to fix it here! Click to Tweet

Potential Causes of the “jQuery Is Not Defined” Error

This error can be quite a surprise. Your site was working just fine yesterday — what happened? This might be a bit of a head-scratcher.

There are a few possible things that could have occurred that threw the “jQuery is not defined” error:

1. Old plugins installed on your WordPress site are conflicting with ones that you installed and activated more recently. If you recently installed or activated new plugins or some of the plugins on your site have not been updated recently, this may be the cause.
2. A slow or poor-performing hosting environment could increase the amount of time it takes your jQuery to perform when called. Double-check your server resources or error log to confirm this.
3. The JavaScript on your website is running before the jQuery is fully loaded. Or perhaps a JavaScript file is not being correctly loaded when the page loads.
4. The CDN that you’re using to improve your site performance was unable to reach your server. If you’re not using a CDN at all, you can rule out this possibility entirely.
5. There’s an error or typo in your version of jQuery. Perhaps someone recently edited a core file or a plugin, which has now caused a conflict.

How To Fix the “jQuery Is Not Defined” Error

Before we dive into the fix, remember to make a backup of your website before editing code! Even the most seasoned developers make mistakes now and again, and having a backup on hand will prevent you from losing any important work as you troubleshoot.

If you have the option, resolve the error on a staging or development site first, as Kinsta customers do, then confirm the fix and push those changes live.

Once you’ve taken those necessary precautions, it’s time to fix that error.

Resolving this error takes some familiarity with adding, removing, and editing code. Don’t worry — you won’t need to write any code from scratch. But it would help if you were prepared to access your site’s code, either through SFTP or through your hosting environment.

It’s not ideal for editing code through the WordPress dashboard code editor. If you don’t already have a good text editor handy, now’s the time to install one.

Here are a few options you can utilize to resolve this error and get your site back up to visitors.

Method 1: Use the Network Tab to Debug if jQuery Is Loading

Look at the Network tab of your browser’s dev tools to see if jQuery is being loaded. This gives you one place to find a quick validation.

The alternative is looking through multiple plugins and themes that could be causing the error. Go through the code of your site and ensure that jQuery is included. It would be best if you only loaded it once.

If the jQuery library isn’t included, add it to your wp_enqueue_script() function with the following snippet:

wp_enqueue_script( 'tt-mobile-menu', get_template_directory_uri() .
'/js/mobile-menu.js', array('jQuery'), '1.0', true );


Locate this code by going to the wp-includes folder, then open the script-loader.php file. If this doesn’t work, or if you find that the jQuery library is, in fact, already included, move on to the following method.

How your snippet will look in the script-loader.php file.

Method 2: Make Sure jQuery Is Loaded

You may experience the “jQuery is not defined error” when jQuery is included but not loaded. Make sure that it’s loaded by finding the script source and pasting the URL in a new browser or tab.

For example, if the <script src= is set to this:

The snippet of text you should look for to find the URL to test.

Then, copy and paste the http://code.jquery.com/jquery-1.11.2.min.js portion into a new window or tab. If the jQuery file loads and shows you the entire contents, you can check this off your list.

Method 3: Include Google-Hosted jQuery With a Local Fallback

This is a great option to include with your JavaScript because running jQuery on the localhost may improve your website experience overall. It will help avoid any other CDN jQuery loading issues.

// Fall back to a local copy of jQuery
window.jQuery || document.write(''))

This is what your code snippet should look like in your code editor. Don’t forget the note!

Method 4: Add a Snippet to wp-config.php File

If none of the above work, open up the wp-config.php file and paste in the following snippet in its entirety:

/** Absolute path to the WordPress directory. */
if ( !defined('ABSPATH') )
define('ABSPATH', dirname(__FILE__) . '/');
define('CONCATENATE_SCRIPTS', false);

What the snippet will look like in your wp-config.php file.

Method 5: Insert the jQuery Library Manually

As a last method, you can go directly into the header.php file and add the jQuery library.

Here’s how:

1. First, go to Google Hosted Libraries and copy the latest version of the jQuery library in its entirety.
2. Open up your header.php file, found in your themes folder.
3. Add in the jQuery library from step one. Make sure it goes in right after the head tag.
4. Save the file when you’re done.

What the snippet will look like in your wp-config.php file.

Good news- you've found the “jQuery is not defined” error. Now it's time to solve it! Click to Tweet

Summary

And there you have it! After following these steps, you should be able to resolve the “jQuery is not defined” error and access your site.

Since this problem is typically due to the browser’s inability to connect with your jQuery library, there are a limited number of solutions you can try. Most people find success with any of the above options.

If none of the above steps have resolved the error for some reason, it’s a good idea to contact your hosting company for support.

Have you encountered this error before? How did you solve it? Let us know in the comments section!

The post 5 Easy Ways to Fix the “jQuery is Not Defined” Error appeared first on Kinsta.