WordPress jQuery uncaught TypeError: $ is not a function

Question

I have a function in my jQuery for my wordpress site. It's in my main.js and above document.ready and my main.js is being loaded after jQuery loads.

Everything works in my static version of the site, it doesn't work when I try to implement it in my theme in wordpress

The function:

function toggleChevron(e) {
    $(e.target)
        .prev('.panel-heading')
        .find("i.indicator")
        .toggleClass('glyphicon-triangle-bottom glyphicon-triangle-left');
}

$('#accordion').on('hidden.bs.collapse', toggleChevron);
$('#accordion').on('shown.bs.collapse', toggleChevron);

It gives this error in my console:

Uncaught TypeError: $ is not a function`

When I try to replace the $ with jQuery I get no errors in my console but it doesn't work. Anyone knows what's going on here? Thanks in advance!

where is this code on the page? does it execute after jQuery is loaded? — YarGnawh
– YarGnawh, Commented Mar 31, 2016 at 14:27
If you run the .on() calls before the element with id "accordion" is in the DOM, you'll get no errors but the calls won't do anything. — Pointy
– Pointy, Commented Mar 31, 2016 at 14:27
If the jQuery variable works but the $ does not it means that another plugin has taken the $ reference away from jQuery or that you've used $.noConflict() somewhere. Either way, we can't help you find where in your code that might be. — Rory McCrossan
– Rory McCrossan, Commented Mar 31, 2016 at 14:27
@YarGnawh Yes it's my main.js and my main.js is loaded after jQuery is loaded. I should add that all my other jQuery does work. I edited OP. — Frank Lucas
– Frank Lucas, Commented Mar 31, 2016 at 14:30

Tim Sheehan · Accepted Answer · 2016-03-31 14:53:52Z

2

Make sure you're scripts are loading in the correct order, if your website is using jQuery in noconflict mode you have two choices:

(function( $ ) {
  $(function() {
    // Your code here
  });
})(jQuery);

Or

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

edited Mar 31, 2016 at 14:53

answered Mar 31, 2016 at 14:40

Tim Sheehan

4,0141 gold badge17 silver badges18 bronze badges

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

1 Comment

Kiloumap Over a year ago

It's working for my new feature, but all of the old features aren't working anymore... Even if is in different script or in my html... :/

Collectives™ on Stack Overflow

WordPress jQuery uncaught TypeError: $ is not a function

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related