循环每个bootstrap幻灯片

Question

我正在尝试遍历引导程序轮播，并为每张幻灯片应用一些jquery。

jquery：

$('.carousel-inner .item').each(function() {
  var windowWidth = $(window).width();
  var carouselHeight = $(this).find('#homecarouselheight').outerHeight();
  $(this).find('.carousel-triangle').css('border-width', '45px 0 0 ' + windowWidth + 'px');
  $(this).find('.carousel-triangle').css('bottom', carouselHeight + 'px');
});

HTML：

<div id="carousel" class="carousel slide carousel-fade" data-ride="carousel">
    <div class="carousel-inner">
        <div class="item active">
            <div class="carousel-triangle test" style="border-width: 45px 0px 0px 1322px; bottom: 63px;"></div>v>
        </div>
        <div class="item">
            <div class="carousel-triangle test" style="border-width: 45px 0px 0px 1322px; bottom: 0px;"></div>
        </div>
    </div>
</div>

出于某种原因，这仅适用于第一张幻灯片。我知道如何将其单独应用于每个幻灯片，因为其中有动态内容。

编辑 - 我添加了html，因为你可以看到63px被应用到第一张幻灯片，但没有高度被添加到第二张幻灯片。