Isotope.js: reveal hidden items

Question

I'm using Isotope v2 & having some trouble revealing previously hidden items. I'm not sure what I'm doing wrong.

To start, I'm gathering an array of jQuery objects & telling Isotope to hide them. This works perfectly:

elements.postsToHide.push($(elements.gridBlock + "#" + v.SocialPostId)); // $(".block#block123")
elements.grid.isotope("hide", elements.postsToHide).isotope();

Eventually, I'd like to reveal these hidden items again. So, on click of a button, I'm doing the following, which does not reveal anything:

elements.grid.isotope("reveal", elements.postsToHide);

The docs say "hide" & "reveal" take and Array of Isotope.Items, which I believe I'm passing properly.

When I call the reveal method, my console says "Uncaught Error: undefined is not a function".

I'm perplexed as to why I can push into an array and hide items, but the same array cannot be revealed.

Answer 1

According to this issue request, Isotope/Masonry hide and reveal methods are mostly internal and aren't the easiest to use.

To get around the issues I was having was to:

1. push items to hide into an array
2. each through the items and use jQuery .hide()
3. once each is done, call .isotope() again to layout grid with newly hidden items
4. to reveal, each through the items and use jQuery .show , then call .isotope again

Answer 2

i did something like this

        //swipe.
    $('.grid').on('swiperight', '.grid-item', function(event) {
        $(this).hide().fadeOut('500', function() {
            $('.grid').isotope('hide', this).isotope('layout');
        });
    });

    $('.filter-button-group').on( 'click', 'button', function() {
        $(this).parent().parent().next().find('.grid-item').show().fadeIn('slow', function() {
            $('.grid').isotope('reveal', this).isotope('layout');
        });
    });

i used hide/show before calling the method