In WordPress jQuery is loaded in noConflict mode, it means that you need to use jQuery instead of the dollar sign $

You could wrap the code in an anonymous function (technically any IIFE) where you pass in jQuery to be mapped to $ and combine this with document ready, like this:

jQuery(document).ready(function($) {
   // $ Works! You can test it with next line if you like
   // console.log($);
});

See link for more explanation: https://digwp.com/2011/09/using-instead-of-jquery-in-wordpress/

In WordPress jQuery is loaded in noConflict mode, it means that you need to use jQuery instead of the dollar sign $

You could wrap the code in an anonymous function (technically any IIFE) where you pass in jQuery to be mapped to $ and combine this with document ready, like this:

jQuery(document).ready(function($) {
    // $ Works! You can test it with next line if you like
    // console.log($);
});

You could also do it without document ready (not recommended):

(function($) {
    // $ Works! You can test it with next line if you like
    // console.log($);
})( jQuery );

See link for more explanation: https://digwp.com/2011/09/using-instead-of-jquery-in-wordpress/