Masonry hide and append

Question

I have a problem with latest Masonry plugin (v3). I need to append hidden elements and show them dynamically. So, i hide some elements and bind "click" event to show some more elements. But the problem is elements doesn't append well. By clicking on the button from the bottom new elements look not so good. All of them have "left:0"

I use this code. For init:

    var $photos_wrapper = jQuery('#photos_wrapper');
    jQuery(window).load(function(){

            $photos_wrapper.masonry({
                itemSelector : '.plug',
                gutter : 15,
                columnWidth : 180,
                isAnimated: !Modernizr.csstransitions
            });
            jQuery("div.num").not(":contains('0')").closest('.item').hide();
            $photos_wrapper.masonry();
    });

And this for click-event:

    jQuery(function(){
        var pg = 0;
        if(pg+2 > max) {
            jQuery('div.more-products').hide();
        }
        jQuery('div.more-products').click(function() {
            pg++;
            jQuery(this).hide();

            var newElements = jQuery("div.num:contains('"+pg+"')").closest('.item');
            newElements.imagesLoaded(function(){
                $photos_wrapper.append(newElements);
                $photos_wrapper.masonry('appended', newElements, true);
            });
        });
    });

What is wrong?...

Answer 1

Update Ok, i found out that much simpler put my hidden elements to another div (not masonry container), and append them like i did before. So, i put all my hidden elements to .hidden-items div and set display:none;

jQuery('div.more-products').click(function() {
            jQuery(this).hide();

            var newElements = jQuery(".hidden-items div.num:contains('"+pg+"')").closest('.item');
            newElements.imagesLoaded(function(){
                $photos_wrapper.append(newElements);
                $photos_wrapper.masonry('appended', newElements, true);
            });

            jQuery(window).scroll(function(){
                if(jQuery(window).scrollTop() + jQuery(window).height() == jQuery(document).height()) {
                    pg++;
                    var newElements = jQuery(".hidden-items div.num:contains('"+pg+"')").closest('.item');
                    newElements.imagesLoaded(function(){
                        $photos_wrapper.append(newElements);
                        $photos_wrapper.masonry('appended', newElements, true);
                    });
                }
            });
        });