title: Define owl carousel parameters in HTML (with class or data attribute)
body: <p>I have a page with few owl carousels. I would like to be able to set some parameters for these owl carousels in HTML code (using a class or data attribute).</p>
  
  <p>Assuming I have two data attributes defined in my HTML, I have created following jQuery code:</p>
  
  <pre><code>$(".owl-carousel").each(function( index ) {
      var items_no = $(this).data('slides');
      var autoplay = $(this).data('autoplay');
      $(".owl-carousel").owlCarousel({
          items : items_no,
          autoplay: autoplay
      });
  });
  </code></pre>
  
  <p>And as you may expect it is not working. The parameters from first owl carousel are applied to all carousels. I have no idea how to make it work. Below is a fiddle with my attempt.</p>
  
  <p><a href="http://jsfiddle.net/t2gj8eg2/4/" rel="nofollow">http://jsfiddle.net/t2gj8eg2/4/</a></p>
  
  <p>I would be very grateful for anyone that is able to fix it for me. Thanks in advance</p>