Error in slick.js: "Uncaught TypeError: Cannot read property 'add' of null"
<p>I used slick js for slider view of image.</p>

<p>Here is my code.</p>

<pre><code>&lt;div class="slider_wrap add-remove"&gt;
    &lt;%= f.fields_for :images do |image_form| %&gt;
      &lt;%#= render 'images_fields', :f =&gt; image_form %&gt;
        &lt;div&gt;
          &lt;%= image_tag image_form.object.picture.url,:class=&gt;"drop_down_link even img_prev" %&gt;
        &lt;/div&gt;
        &lt;div class="image_upload_div"&gt;
          &lt;div class="image-upload"&gt;
            &lt;label&gt;
              &lt;i class="fa fa-cloud-upload"&gt;
                &lt;%= image_form.file_field :picture ,:'data-role'=&gt;"none",:onchange=&gt;"readURL(this);" , :accept =&gt; 'image/jpeg , image/png' %&gt;
              &lt;/i&gt;
            &lt;/label&gt;
          &lt;/div&gt;
        &lt;/div&gt;
    &lt;% end %&gt;
    &lt;%= f.link_to_add "Add a picture", :images ,:id=&gt;"add_pic" ,:class=&gt;"js-add-slide", :style=&gt;"display: none;"%&gt;
&lt;/div&gt;

&lt;script&gt;
function silder(){
    slideIndex = 0;
      $('.add-remove').slick({
        slidesToShow: 2,
        slidesToScroll: 2
      });
      $('.js-add-slide').on('click', function() {
        $('.add-remove').slick('slickAdd');
      });

      $('.js-remove-slide').on('click', function() {
        $('.add-remove').slick('slickRemove');
      });
});
function readURL(input) {
  if (input.files &amp;&amp; input.files[0]) {
    var reader = new FileReader();
    reader.onload = function (e) {
    $('.img_prev').last()
      .attr('src', e.target.result)
    };

    reader.readAsDataURL(input.files[0]);

    setTimeout(function(){
      $('#add_pic').trigger('click');
      silder();
    }, 100);
  }
}
&lt;/script&gt;
</code></pre>

<p>Now with this code I got slider working, but its not coming proper I am getting error:</p>

<blockquote>
  <p>Uncaught TypeError: Cannot read property 'add' of null</p>
</blockquote>