Masonry and imagesLoaded error

I combined masonry with imagesLoaded like this:

var container = document.querySelector('.masonry-container');
var msnry;
    // initialize Masonry after all images have loaded
    imagesLoaded( container, function() {
        var msnry = new Masonry( container, {
            itemSelector: '.masonry-item'
        }).resize();
});

But getting error: Uncaught TypeError: Cannot read property 'length' of null

What am I doing wrong.

Edit

I'm having two masonry calls, maybe that causes problem, another one is the same, one after another:

var container = document.querySelector('.gallery');
var msnry;
    // initialize Masonry after all images have loaded
    imagesLoaded( container, function() {
        var msnry = new Masonry( container, {
            itemSelector: '.gallery-item'
        }).resize();
});

Found a problem. In masonry call I had var container twice which just overwrites one another. Ex. in specific page I just had div with class .gallery but not .masonry-container, and var container is overwritten with .masonry-container which doesn't exists, so it returns null. Solution is:

var $container = $('.masonry-container');
    $container.imagesLoaded(function(){
    $container.masonry({
        itemSelector : '.masonry-item'
    });
});

var $container2 = $('.gallery');
    $container2.imagesLoaded(function(){
    $container2.masonry({
        itemSelector : '.gallery-item'
    });
});

As seen here: Using jQuery Masonry Many times in the same site