$(window).load(function() not always working

I'm trying to implement a scrollbar plugin on a div on my website but I'm facing a few issues with it. first of all it was supposed to be working like this:

jQuery(document).ready(function ($) {
    "use strict";
    $('.chat-messages').perfectScrollbar({suppressScrollX: true});
  });

But I could only make it work like this:

$(window).load(function() {
    "use strict";
    $('.chat-messages').perfectScrollbar({suppressScrollX: true});
});

But with window.load the script doesn't seems to be working all the time, or at least the scroll bar doesn't always appear.

I'm not very familiar with js or jquery but I inserted the src file perfect-scrollbar.js in a folder and I'm calling it normally like this: <script src="http://ift.tt/1EYHISJ"></script> on the header and puting the code that I described above with the window.load right after it between <script></script>. I'm assuming that this is a conflict with another document ready so I searched online for solutions and other ways to load it and I found the no conflict thingy and tried to implement like this:

$.noConflict();
jQuery( document ).ready(function( $ ) {
     "use strict";
   $('.chat-messages').perfectScrollbar({suppressScrollX: true});
   });
});

but still no results, the only thing that this does is to stop all jquery of the website from working. Can anyone help me with this? thanks in advance