Refreshing Owl Carousel 2

I want to set new html content for my carousel and the above answers did not worked for me
so I solved my problem with another way

first, define a function to start owlCarousel and run that function

let myCarousel; //a variable thats hold owlCarousel object
function myCarouselStart() {
    myCarousel = $('#my-carousel.owl-carousel').owlCarousel(setting);
}

$(document).ready(() => {
    myCarouselStart(); // run owl carousel for first time
});

then when you want to refresh the carousel use the below code

 myCarousel.trigger("destroy.owl.carousel");
 $("#my-carousel").html(newHtmlContent);
 myCarouselStart();

if .trigger('refresh.owl.carousel'); didn't work with you, you can use

window.dispatchEvent(new Event('resize'));

which will make the carousel refresh automatically.

You trigger with a class. You can try with a variable:

var $owl = $('.owl-carousel').owlCarousel({
    items: 1,
    loop:true
});

$owl.trigger('refresh.owl.carousel');