widgets selective refresh and owl carousel 2

Hi! I am trying to add a carousel, Owl script, and I am also using selective refresh in widgets.

Each widget is a carousel item/slide, I got the carousel to reinitialize when a widget is added, the problem is I can’t change the items position when I move those widgets.

The script looks like this:

$( document ).ready(function() {
			var newCarousel = $('carousel');
			newCarousel.owlCarousel({
				responsiveClass:true,

				responsive:{
					0:{
						items:1,
						nav:true
					},
					600:{
						items:2,
						nav:false
					},
					1000:{
						items:4,
						nav:true,
						loop:false
					}
				}
			});

			$('.next').click(function(event) { event.preventDefault(); newCarousel.trigger('next.owl.carousel', [200]); });
			$('.prev').click(function(event) { event.preventDefault(); newCarousel.trigger('prev.owl.carousel', [200]); });

			if ( 'undefined' !== typeof wp && wp.customize  ) {
				wp.customize.selectiveRefresh.bind( 'sidebar-updated', function( sidebarPartial ) {
					if ( 'sidebar-id' === sidebarPartial.sidebarId ) {
							newCarousel.data('owlCarousel').destroy();
							newCarousel.removeClass('owl-carousel owl-loaded');
							newCarousel.find('.owl-stage-outer').children().unwrap();
							newCarousel.removeData();
							newCarousel.owlCarousel();
					}
				});
			}
		});

Thanks in advance!