Infinite Scroll with Isotope and filtering in WordPress

I have searched just about every forum out there and found several ways to make a Isotope masonry layout with filtering work with Infinite Scroll running WordPress. And none of them seem to be giving me what I’m looking for.

At the moment I got the Masonry layout working, with filtering. When I implement Infinite Scroll it loads the content underneath the other content, a pretty common issue working with Isotope and Infinite scroll. However, when applying the .appended method in order to sort the newly loaded posts into my site, it messes up my whole layout.

I suspect I’m not entering the .appended line at the right place. Here’s my js without the .append:

$(function () {
    var $page = $('#page')
});

$(function () {
    var $container = $('#content'),
            filters = {},
            // get filter from hash, remove leading '#'
            filterSelector = window.location.hash.slice(1);

    $container.imagesLoaded(function () {
        // bind isotope to window resize
        $(window).smartresize(function () {
            // jQuery has issues with percentage widths
            // so we'll manually calulate it
            var colW = Math.floor($container.width() * 0.49);

            $container.isotope({
            });
            // trigger resize so isotope layout is triggered
        }).smartresize();
    });

    $('#nav a').click(function () {
        // store filter value in object
        // i.e. filters.color = 'red'
        var $this = $(this),
                name = $this.attr('data-filter-name'),
                value = $this.attr('data-filter-value'),
                isoFilters = [],
                filterName, prop;

        filters[ name ] = value;

        for (prop in filters) {
            isoFilters.push(filters[ prop ]);
        }

        var filterSelector = isoFilters.join('');

        // trigger isotope if its ready
        if ($container.data('isotope')) {
            $container.isotope({filter: filterSelector});
        }

        window.location.hash = filterSelector;

        // toggle highlight
        $this.parents('ul').find('.selected').removeClass('selected');
        $this.parent().addClass('selected');

        return false;

    });

    // if there was a filter, trigger a click on the 
    // corresponding option
    if (filterSelector) {
        var selectorClasses = filterSelector.split('.').slice(1);
        $.each(selectorClasses, function (i, selectorClass) {
            $('#nav a[data-filter-value=".' + selectorClass + '"]').click();
        });
    }

    $container.isotope({
        itemSelector: '.box',
        filter: filterSelector,
        animationOptions: {
            duration: 750,
            easing: 'linear',
            queue: false,
        }
    });
});

#nav being my menu, #content being my container, and .box being my posts.

Could anyone advise me as to where I need to insert the .appended command?