title: initializing many slick carousels in page
body: <p>I am dynamically loading slick carousels into a page. I do not know the total slides available to each carousel. Hard coding it works fine, however, I would like it to dynamically change the "slidesToShow" setting to be at most 3. If it is 2 or 1 however, I would like it to return 1. </p>
  
  <p>I am successfully using a loop to get each slider like so:</p>
  
  <pre><code>$(".carousel").each(function(index){
    //set each carousel/slider
    $(this).slick()....
  })
  </code></pre>
  
  <p>I am able to get the total slides for each slider with init:</p>
  
  <pre><code>$(this).on("init", function(event, slick){
                      slidetoshowscroll = parseInt(slick.slideCount);
                      if(slidetoshowscroll &gt; 3){
                          slidetoshowscroll = 3;
                      }
                      if(slidetoshowscroll &lt; 3){
                          slidetoshowscroll = 1;
                      }
  //shows the correct slide #s
                      console.log(slidetoshowscroll);
  
                  })
  </code></pre>
  
  <p>This gives me 3,1,3 etc... as the sliders are initiated. </p>
  
  <p>However, I am not able to set the dynamic "slidetoshowscroll" variable on the slider itself:</p>
  
  <pre><code>$(this).slick({
                      autoplay: false,
                      arrows: true,
                      infinite: false,
                      speed: 300,
                      slidesToShow: slidetoshowscroll,
                      slidesToScroll: 1
  });
  </code></pre>
  
  <p>How can I dynamically let "slick" know how many slides I have to show for each slideshow?</p>