Solve - $(...).load is not a function jQuery Error

avatar

Borislav Hadzhiev

Tue Oct 19 20212 min read

Solve - $(...).load is not a function #

The "$(...).load is not a function" jQuery error occurs for multiple reasons:

  1. Loading the jQuery slim version instead of jQuery.
  2. Loading the jQuery library twice.
  3. Specifying an incorrect path to the jQuery files.

jquery load is not a function error

To solve the "$(...).load is not a function" jQuery error, make sure to load the full version of the jQuery library. The slim version of the library excludes some functions like ajax and load. The library should only be loaded once on the page, otherwise the error is thrown.

index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> </head> <body> <div id="content"><h2>Placeholder text</h2></div> <button id="btn">Make request</button> <!-- ✅ load jQuery ✅ --> <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous" ></script> <script src="index.js"></script> </body> </html>

We loaded the full version of the jQuery library before loading our script (the index.js file in the example).

Here's the content for the index.js file.

index.js
$(document).ready(function () { $('#btn').click(function () { $('#content').load('https://randomuser.me/api/'); }); });

We wait for the DOM to be ready and add an event listener that makes an HTTP request on button click.

jquery load

If you open your browser and click on the button, you'll see the JSON response from the API.

If you're still getting the error, make sure you're loading the regular jQuery version (not the slim one) and you're loading the library only once.

Loading the jQuery library twice, re-runs the initialization process and causes the error.

When loading the jQuery library from a file on your local files system, make sure that the path you specify is correct and points to the right file.

Specifying an incorrect path to the jQuery script is equivalent to not loading the script at all.

You can check if the specified path is correct by opening the console in your browser and checking if you have any 404 errors related to loading the jQuery library.
Use the search field on my Home Page to filter through my more than 1,000 articles.