Many times while using WordPress, if we try to use "$” to access jQuery, we get an error the "$ is not defined”. This happens because the jQuery library which is included in WordPress loads in "no conflict” mode. In the no conflict mode jQuery returns the control of "$”, and it is no longer accessible as a function, variable, or alias for jQuery. WordPress does this in order to prevent compatibility problems with other JavaScript libraries that can be loaded.
To solve this we can use "jQuery” instead of "$”. So, instead of using the standard code with "$”
$(document).ready(function(){ $(#selector) ... });
we can use the following code, which uses "jQuery” instead of "$”
jQuery(document).ready(function(){ jQuery(#selector) ... });
If you want to use the default "$” symbol, it can be done by wrapping the code within a function
(function($) { // You can use $() inside of this function $(#selector) ... })(jQuery);
If you want to execute the jQuery code on document ready you can use the following instead of the above code:
jQuery(document).ready(function($) { // You can use $() inside of this function $(#selector) ... });