Jquery toggle for working in multiple instances

I have a show / hide effect that works, but I just need to use it several times on the page. Currently, he is switching all the elements. I can’t figure out how to do this.

Hope you can help.

http://pastebin.me/29328e556caf53e9a1925030d65b864b

+3
source share
2 answers

You can edit your function a little, it will work on each <ul>offline mode:

$('.facet ul').each(function() {
  if($(this).children('li:gt(9)').hide().length === 0) return;
  $(this).append(
    $('<li id="toggler">More</li>').toggle(function() {
       $(this).text('Hide').siblings().show();
    }, function() { 
       $(this).text('More').siblings('li:gt(9)').hide();
    }));
});​

See a working demo here

Before that, he received any limore than 9, you want to make this for <ul> an element with .each(), as in the example above.

+2
source
0

Source: https://habr.com/ru/post/1739158/


All Articles