5 Easy Ways to Fix the "jQuery is Not Defined" Error (2024)

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!

Check Out Our Video Guide to Fixing the “jQuery Is Not Defined” Error

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.

5 Easy Ways to Fix the "jQuery is Not Defined" Error (1)

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 pluginsor 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.

5 Easy Ways to Fix the "jQuery is Not Defined" Error (2)

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:

5 Easy Ways to Fix the "jQuery is Not Defined" Error (3)

Then, copy and paste the http://code.jquery.com/jquery-1.11.2.min.jsportion 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(''))

5 Easy Ways to Fix the "jQuery is Not Defined" Error (4)

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);

5 Easy Ways to Fix the "jQuery is Not Defined" Error (5)

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.
5 Easy Ways to Fix the "jQuery is Not Defined" Error (6)

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!

5 Easy Ways to Fix the "jQuery is Not Defined" Error (7)

Allie Nimmons

Allie Nimmons is a WordPress content writer and producer with 6 years of site building experience. She has published WordPress-focused educational content with Automattic, LinkedIn Learning, GiveWP, GoDaddy, WP Buffs, and iThemes.

5 Easy Ways to Fix the "jQuery is Not Defined" Error (2024)

FAQs

5 Easy Ways to Fix the "jQuery is Not Defined" Error? ›

To fix the ReferenceError: $ is not defined error, jQuery should be properly loaded before any code that references it is executed. This can be done by including the library in the HTML file using a script tag, either by downloading the library and hosting it locally or by using a content delivery network (CDN) link.

How to solve an undefined error in jQuery? ›

Here is a step-by-step guide:
  1. Get the latest version of jQuery Library from Google Hosted Libraries.
  2. Open your theme's header. php file.
  3. Paste what you got in the first step just after the head tag.
  4. Save your file.
Feb 5, 2020

How to solve an is not defined error? ›

To fix the ReferenceError: $ is not defined error, jQuery should be properly loaded before any code that references it is executed. This can be done by including the library in the HTML file using a script tag, either by downloading the library and hosting it locally or by using a content delivery network (CDN) link.

What is jQuery if not defined? ›

jQuery is not defined. The error means that jQuery is required by another script, but due to the optimization, it's not available when that initial script runs, and therefore triggers an error.

How to fix uncaught ReferenceError jQuery is not defined WordPress? ›

Luckily, there are four easy solutions to fix this common issue:
  1. Add the absolute path to the wp-config. php file.
  2. Include Google-hosted jQuery with an alternate fallback.
  3. Manually add the jQuery library to the theme's header file.
  4. Make sure jQuery is loaded correctly.

How to fix jQuery not defined error? ›

How to fix the jQuery is not defined error
  1. Verify jQuery is loaded by testing the script source.
  2. Alternate methods to verify jQuery loading.
  3. Ensure jQuery is correctly included in WordPress.
  4. Implement a local fallback with Google hosted jQuery.
  5. Add a snippet to wp-config. php file.
  6. Manually add jQuery library.
Mar 27, 2024

How do I get rid of undefined error? ›

Always Declare and Initialize Variables

The simplest way to avoid undefined variable errors is to always declare and initialize your variables before using them. This helps ensure that your variables have valid values and are not accidentally accessed before they are declared or initialized.

What causes undefined errors? ›

Undefined Errors

These occur when a variable is not defined or has a value of undefined. This can happen when a variable is declared but not initialized, or when a function returns undefined.

How to solve document not defined error in JavaScript? ›

Methods to Solve the Error
  1. Checking Environment. Ensure that your code is running in a browser environment if it relies on the document object. ...
  2. Using window. onload. ...
  3. Using DOMContentLoaded Event. ...
  4. Placing Scripts at the End of the Body.
Jul 9, 2024

Why does jQuery not work? ›

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. The CDN that you're using to improve your site performance was unable to reach your server.

How to check not undefined in jQuery? ›

You can use the strict equality operator ( === ) to check if a value is undefined :
  1. value === undefined. You can also check if the type of a value is undefined using the typeof operator:
  2. typeof value === 'undefined' ...
  3. function myFunction() { const undefined = "string value"; console.
Dec 15, 2022

How to define jQuery? ›

What is jQuery? jQuery is a lightweight, "write less, do more", JavaScript library. The purpose of jQuery is to make it much easier to use JavaScript on your website.

Why data is undefined in jQuery? ›

In jQuery, if a variable is declared but the value is not assigned to it, then an undefined value is assigned to the variable automatically.

How to check for not defined JavaScript? ›

The way I recommend to check for undefined in JavaScript is using the strict equality operator, === , and comparing it to the primitive undefined . Checking for `undefined`` this way will work in every use case except for one, if the variable hasn't been declared yet.

How do you fix the error require is not defined in JavaScript? ›

The Javascript ReferenceError: require is not defined error can be fixed by using the following approaches: If the error occurs in a web browser environment, a different method to load external dependencies should be considered. For example, <script> tags or a module loader like RequireJS.

How do I fix uncaught type error? ›

To fix this error, you need to ensure that the variable is properly initialized before accessing its properties or methods. Make sure to replace 'myElement' with the appropriate ID or variable name in your code.

How do you resolve undefined error? ›

A declared variable but not yet assigned with a value (uninitialized) is undefined . myVariable is declared and not yet assigned with a value. Accessing the variable evaluates to undefined . An efficient approach to solve the troubles of uninitialized variables is whenever possible to assign an initial value.

How do I fix undefined reference error? ›

How to Avoid Undefined Reference Error in C++
  1. Double-check function definitions for consistency with declarations.
  2. Verify that all necessary header files are included.
  3. Inspect library linking instructions and ensure proper library paths.
  4. Scrutinize code for typos and misspellings in object names.
Jan 31, 2024

How to handle an undefined variable in jQuery? ›

Next, the x and y variables are comparing with the “undefined” primitive by using the “typeof” operator. The x variable automatically gets the “undefined” value so the condition becomes true whereas y has some value so the condition becomes false for it and the message is displaying according to this.

Top Articles
Latest Posts
Article information

Author: Kelle Weber

Last Updated:

Views: 6382

Rating: 4.2 / 5 (73 voted)

Reviews: 88% of readers found this page helpful

Author information

Name: Kelle Weber

Birthday: 2000-08-05

Address: 6796 Juan Square, Markfort, MN 58988

Phone: +8215934114615

Job: Hospitality Director

Hobby: tabletop games, Foreign language learning, Leather crafting, Horseback riding, Swimming, Knapping, Handball

Introduction: My name is Kelle Weber, I am a magnificent, enchanting, fair, joyous, light, determined, joyous person who loves writing and wants to share my knowledge and understanding with you.