Uncaught ReferenceError: jQuery is not defined in wordpress custom script

Question

My jquery file is not working in WordPress.

The error is here:

My js code:

(function($) {
    $(document).ready(function(){
    $('#read_more').click(function() {
    $('.display_none').show().animate({'transition': '2s'});
   });
  });
})( jQuery );

I have an added custom-script.js file in functions.php like this:

function aristo_css_js(){
  wp_enqueue_script('myjs', get_template_directory_uri().'/assets/js/custom-script.js');
  wp_enqueue_script('myjs');
}
add_action('wp_enqueue_scripts','aristo_css_js');

What is the main problem for this was not working? But if I added custom script code before body tag it's working. ?

Check the order of your scripts, chances are your own is loaded before jQuery. — user5734311
– user5734311, Commented Mar 4, 2019 at 7:24

user11130345 · Accepted Answer · 2019-03-04 09:03:58Z

2

I solve my own question by add jquery file before my custom-script

wp_enqueue_script('jquery-main', get_template_directory_uri().'/assets/js/jquery-3.3.1.min.js');
wp_enqueue_script('myjs', get_template_directory_uri().'/assets/js/custom-script.js');

answered Mar 4, 2019 at 9:03

user11130345

Sign up to request clarification or add additional context in comments.

Comments

fiza khan · Accepted Answer · 2019-03-04 07:36:53Z

0

I had this same issue once.

WordPress ships with its own version of the jQuery library.

Try using jQuery instead of just $ sign.

For example:

var svg = $("#svg-container");

should be replaced with

var svg = jQuery("#svg-container");

edited Mar 4, 2019 at 7:36

fiza khan

1,30614 silver badges24 bronze badges

answered Mar 4, 2019 at 7:25

Johar Zaman

2,12321 silver badges30 bronze badges

2 Comments

user5734311 Over a year ago

1. OP is already doing this (IIFE passing jQuery) 2. check the error message OP has posted: jQuery is not defined

Johar Zaman Over a year ago

Then double check the order of your scripts. Make sure the jquery script is before your custom script.

Priyanka Modi · Accepted Answer · 2019-03-04 10:10:06Z

0

Try to use this updated javascript code,

jQuery.noConflict();
(function(jQuery) {
    jQuery(document).ready(function(){
    jQuery('#read_more').click(function() {
    jQuery('.display_none').show().animate({'transition': '2s'});
   });
  });
})( jQuery );

function aristo_css_js(){
 wp_enqueue_script('jquery-main', get_template_directory_uri().'/assets/js/jquery-3.3.1.min.js');
wp_enqueue_script('myjs', get_template_directory_uri().'/assets/js/custom-script.js');
}
add_action('wp_enqueue_scripts','aristo_css_js');

Thanks!

edited Mar 4, 2019 at 10:10

answered Mar 4, 2019 at 7:47

Priyanka Modi

1,6341 gold badge9 silver badges14 bronze badges

1 Comment

user11130345 Over a year ago

I already mentioned it on my question. I found the same error when I change with code.

jozef koko · Accepted Answer · 2020-04-27 20:55:31Z

0

I hope this will fix your issue

(function($) {

// Use $() inside of this function like so 

$(#selector)

})(jQuery);

edited Apr 27, 2020 at 20:55

answered Apr 27, 2020 at 20:49

jozef koko

1425 bronze badges

Collectives™ on Stack Overflow

Uncaught ReferenceError: jQuery is not defined in wordpress custom script

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related