OwlCarousel и триггер prev.owl.carousel и next.owl.carousel

у меня есть код

var owl_news = $("#owl-caro-news");
owl_news.owlCarousel({
    items : 5,
    navigation: true,
    navigationText : ["<div class='sprite left-arr'></div>","<div class='sprite right-arr'></div>"],
    pagination: false,
    itemsDesktop : [1000,4], //5 items between 1000px and 901px
    itemsDesktopSmall : [900,3], // betweem 900px and 601px
    itemsTablet: [600,2], //2 items between 600 and 0
});
var html = '<div class = "owl-controls1"><div class = "owl-buttons"><div class = "owl-prev"><div class = "sprite left-arr"></div></div><div class = "owl-next"><div class = "sprite right-arr"></div></div></div></div>';
$("#owl-caro-news").append(html);

а также

$('#owl-caro-news .owl-controls1 .owl-next').on('click', function(e) {
$("#owl-caro-news .item a.active").parent().parent().next().find("a").click();
    owl_news.trigger('next.owl.carousel');
});
$('#owl-caro-news .owl-controls1 .owl-prev').on('click', function(e) {
$("#owl-caro-news .item a.active").parent().parent().prev().find("a").click();
    owl_news.trigger('prev.owl.carousel');
});

но не работает, нажатие на стрелку не прокручивает активную область