I have a simple jQuery script in a WordPress plugin that is using a jQuery wrapper like this:
$(document).ready(function(){
// jQuery code is in here
});
I am calling this script from within the WordPress Dashboard and am loading it AFTER the jQuery framework has loaded.
When I check the page in Firebug I constantly keep receiving the error message:
TypeError: $ is not a function
$(document).ready(function(){
Should I maybe wrap the script in this function:
(function($){
// jQuery code is in here
})(jQuery);
I have had this error quite a few times and am not sure how to handle it.
Any help would be greatly appreciated.
Use
instead of
or
Within the function, $ points to jQuery as you would expect
What worked for me. The first library to import is the query library and right then call the jQuery.noConflict() method.
By default when you enqueue jQuery in Wordpress you must use
jQuery
, and$
is not used (this is for compatibility with other libraries).Your solution of wrapping it in
function
will work fine, or you can load jQuery some other way (but that's probably not a good idea in Wordpress).If you must use
document.ready
, you can actually pass$
into the function call:Credit to Ashwani Panwar and Cyssoo answer: https://stackoverflow.com/a/29341144/3010027
Also, I find the good solution for use jQuery noConflict mode.
I found this solution from here. https://thecodingstuff.com/how-to-properly-use-jquery-noconflict-mode-in-wordpress/