Jquery conflict when enqueue script, what am I doing wrong?

Question

Im using masonry in a wordpress installation, and it conflicts with a jquery mobile navigation plugin. I have the Masonry code in a .js file and then enqueue it in functions. Though It was correct, but I guess not..

In the .js file:

(function( $ ) {
"use strict";
$(function() {
//set the container that Masonry will be inside of in a var
var container = document.querySelector('ul.rss-agreggator');
//create empty var msnry
var msnry;
// initialize Masonry after all images have loaded
imagesLoaded( container, function() {
    msnry = new Masonry( container, {
        itemSelector: 'li.feed-item'
    });
});
});
}(jQuery));

And how I enqueue the script in functions.php:

function wpb_adding_scripts() {
wp_enqueue_script( 'masonry' );
wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'masonryInit', get_stylesheet_directory_uri().'/js/masonry.js', array(    'masonry', 'jquery' ) );
}

add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts' );  

Answer 1

var $ = jQuery.noConflict();
$(document).ready(function($) {
    //set the container that Masonry will be inside of in a var
    var container = document.querySelector('ul.rss-agreggator');
    //create empty var msnry
    var msnry;
    // initialize Masonry after all images have loaded
    imagesLoaded(container, function() {
        msnry = new Masonry(container, {
            itemSelector: 'li.feed-item'
        });
    });
});