By Keutelvocht


2019-11-08 14:13:10 8 Comments

Im trying to toggle between 2 classes after an ajax call but i get this error:

TypeError: toggleButton.children(...)[0].toggleClass is not a function

This is my code

console.log(toggleButton.children()['0']);
toggleButton.children()['0'].toggleClass('fa-check fa-times');

This is the element i am trying to toggle how it shows in the console

<i class="fas fa-times" style="color:red">

1 comments

@Rory McCrossan 2019-11-08 14:15:01

Accessing a jQuery object by index (eg. children()[0]) returns the underlying Element object, not a jQuery object, hence toggleClass() is undefined.

To fix this you can use jQuery's methods instead of [0]. In this case, either first() or eq(0) will work:

toggleButton.children().first().toggleClass('fa-check fa-times'); 

@Keutelvocht 2019-11-08 14:17:08

Just found this works to .find(">:first-child") but your answer works also. Thanks alot!

@Rory McCrossan 2019-11-08 14:18:28

No problem, glad to help. Just for reference there's also :nth-child(), :first-child and :first() :)

Related Questions

Sponsored Content

24 Answered Questions

[SOLVED] jQuery Ajax File Upload

31 Answered Questions

[SOLVED] How to manage a redirect request after a jQuery Ajax call

18 Answered Questions

[SOLVED] jQuery AJAX submit form

10 Answered Questions

[SOLVED] TypeError: $.ajax(...) is not a function?

  • 2013-08-16 10:31:35
  • ReactingToAngularVues
  • 258444 View
  • 172 Score
  • 10 Answer
  • Tags:   jquery ajax json

17 Answered Questions

13 Answered Questions

[SOLVED] How to find elements by class

20 Answered Questions

[SOLVED] Wait until all jQuery Ajax requests are done?

18 Answered Questions

[SOLVED] Abort Ajax requests using jQuery

14 Answered Questions

25 Answered Questions

[SOLVED] Is Safari on iOS 6 caching $.ajax results?

Sponsored Content