Получить заголовок карусели из текущего индекса начальной загрузки 4 и отобразить в другом элементе div

Question

Я пытаюсь отобразить текст карусели из карусели bootstrap 4 в другом div.

Пока что я могу получить текущий индекс, и я также могу получить текст отдельно, но я не могу понять, каксоединить их вместе.

Мой код указан ниже, может кто-нибудь помочь присоединиться к точкам.

$('#carousel-1').on('slide.bs.carousel', function(e){
  e.from          // The index of the current item. 
    alert(e.from);
});

$(".carousel-text").append($(".carousel-caption").html()); 

------------- ОБНОВЛЕНИЕ ----------------------------

У меня это работает, но теперь есть задержка в отображении заголовка карусели

Таким образом, на слайде 2 будет отображаться заголовок слайда 1

Я попытался добавить setTimout, чтобы соответствовать интервалу слайдера, но не повезло

Новый код

$('#carousel-1').on("slide.bs.carousel", function(e){
var carouselText = $('.active').find('.carousel-caption').html();
    $(".carousel-text").append(carouselText).html("");
     $(".carousel-text").append(carouselText).html();
 });

Answer 1

Исправлено, если кто-то еще сталкивался с этим вот мой рабочий код

$('.carousel').carousel({
  interval: 2000
});

$('.carousel-text').html($('.active > .carousel-caption').html());
$('.carousel').on('slid.bs.carousel', function () {
    $('.carousel-text').html($('.active > .carousel-caption').html());
    });