Uncaught TypeError: $ is not a function WordPress

Uncaught TypeError: $ is not a function

WordPress uses jQuery and other JavaScript libraries for its content management. The Uncaught TypeError: $ is not a function is commonly seen when using $ instead of jQuery with WordPress because of default scripting that prevents conflict with other libraries. The $ sign in jQuery is a syntax commonly used as a shortcut to access/define JavaScript libraries and their functions/methods. jQuery is a JavaScript library that makes it easy to manipulate the HTML elements using events by working with the Document Object Model (DOM) interface.

As $() and jQuery() syntaxes are strictly equal methods and WordPress uses jQuery() for the compatibility with its other libraries. jQuery library is auto set to the noConflict() mode and executes its own libraries and scripts before any custom scripts. so the $() syntax access becomes unavailable and throws the Error.

Solutions for  Uncaught TypeError: $ is not a function:

There are multiple ways to fix this issue and those are below:

1- by using jQuery()

jQuery(document).ready(function($){
      // your code goes here.
  });

2- use $() inside jQuery object

jQuery(function($){
    $(".element").click(function(){
      // jQuery code
    });
  });

3- setting the variable $ to noConflict

var $ = jQuery.noConflict();

  $(document).ready(function(){
    // jQuery code
  });

Note: overriding the noConflict() mode to prevent this error is not a good idea as it may cause conflicts with the compatibility/working of other libraries in WordPress. You can use $() inside the function invoked with jQuery().

You can get more details about this topic from here.
To get to know more about other JQuery topics, you can check these articles too.

Please follow and like us: