Mutlple owl Carousel in one page with different setting

Question

There are two owlCarousel working perfectly in one page but I want to change the default setting on each carousel. Once I changed the effects applying to both carousel.

What I've already tried

<script>
    $(document).ready(function() {
      $("#owl-demo").owlCarousel1({
        navigation : false,
        pagination : true,
        items : 1
      });
    });

</script>
<script>
    $(document).ready(function() {

    $("#owl-example").owlCarousel();


    });
</script>

I want to change the below settings for each carousle

 $.fn.owlCarousel.options = {

        items : 4,
        itemsCustom : false,
        itemsDesktop : [1199, 1],
        itemsDesktopSmall : [979, 1],
        itemsTablet : [768, 1],
        itemsTabletSmall : false,
        itemsMobile : [479, 1],
        singleItem : false,
        itemsScaleUp : false
}

Answer 1

If you assign a variable to each of the div's you wish to target and then assign the options, example below;

$(document).ready(function() {
   var one = $("#one");
   var two = $("#two");

  one.owlCarousel({
      navigation : false, // Show next and prev buttons
      slideSpeed : 300,
      paginationSpeed : 400,
      singleItem:true,
      mouseDrag:false,
      touchDrag:false
  });  

two.owlCarousel({
  navigation : true, // Show next and prev buttons
  slideSpeed : 300,
  paginationSpeed : 400,
  singleItem:true,
  mouseDrag:false,
  touchDrag:false,
  navigationText : false,
  rewindSpeed : 300,
  });

});