TypeError:$(document).ready is not a function in jQuery [Solved]
In this tutorial, we are going to learn about how to solve the TypeError: $(document).ready is not a function in jQuery.
The “TypeError: $(document).ready is not a function” in jQuery error occurs one of the following reasons:
-
Initializing the jQuery library after the JavaScript code.
-
Using the jQuery library without adding to the HTML file.
-
Using the second set of paranthesis
()
after the calling the ready() method. -
Overriding the
$
symbol or jQuery variables in your code.
Here is an example, how the error occurs:
$(document).ready(function(){
console.log('hello jquery');
})();
Output:
Uncaught TypeError: $(...).ready(...) is not a function
In the above example, we have got the error because we are using the extra paranthesis ()
after the ready()
method.
To solve the “TypeError: $(document).ready is not a function” in jQuery, remove the paranthesis after the ready method and makesure to run the JavaScript code after the jQuery library initialization.
Here is an example, how to fix the error:
$(document).ready(function(){
console.log('hello jquery');
});
The order of loading the jQuery library and JavaScript file is important while working with jQuery.
-
First jQuery library.
-
JavaScript file.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Loding jquery</title>
</head>
<body>
<h1>Good morning</h1>
<!-- Your jQuery library -->
<script
src="https://code.jquery.com/jquery-3.6.3.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
crossorigin="anonymous"
></script>
<!-- Your JS script file goes here -->
<script src="app.js"></script>
</body>
</html>