I have my HTML as below

<div class="blog-box">
    <div class="blog-item" >...</div>
    <div class="blog-item" >...</div>
    <div class="blog-item" >...</div>
</div>

and javascript with jquery and isotope js as

var $container=$('.blog-box');

try{
    $container.imagesLoaded( function(){
        $container.show();
        $container.isotope({

            filter:'*',
            layoutMode:'masonry',

            animationOptions:{
                duration:750,
                easing:'linear'
            }
        });
    });
} catch(err) {
}

When I try to add more blog item elements dynamically using javascript, the width of the blog-box item becomes zero. I have tried rerunning the js above every time I add items to the blog-box but it's not working out. How do I be able to add more blog-items without interfering with the layout?