How to remove an item from owl-carousel 2?

Question

How can I remove an item from an owl carousel gallery?

Here's my html markup:

<div class="owl-carousel owl-theme">
    <img src="/assets/storage/gallery/1.jpg"></div>
    <img src="/assets/storage/gallery/2.jpg"></div>
    <img src="/assets/storage/gallery/3.jpg"></div>
    <img src="/assets/storage/gallery/4.jpg"></div>
</div>

And here's my JavaScript:

$(".owl-carousel").owlCarousel({
  items: 1,
  margin: 10,
  rtl: true,
  autoHeight: true,
  lazyLoad: true
});

Answer 1

according to Owl Carousel Documentation you can remove an index as following, however Owl Carousel 2 is in beta version right now, make sure to check docs in future for better ways (if they ever implement):

var indexToRemove = 2;
$(".owl-carousel").trigger('remove.owl.carousel', [indexToRemove]).trigger('refresh.owl.carousel');

according to a comment, if it didn't work for you try the following:

var owlCarousel = jQuery(".owl-carousel").data('owlCarousel');
owlCarousel.removeItem(1);