我已经创建了一个滑块，每8秒改变一次内容，但我不知道为什么进度条在第二个滑块之后没有动画，有人能帮忙吗？

jQuery(document).ready(function() {
        //Quotes rotator
        var divs = jQuery(".cbp-qtcontent");

        function fade() {
            var current = jQuery(".current");
            var currentIndex = divs.index(current),
                nextIndex = currentIndex + 1;

            if (nextIndex >= divs.length) {
                nextIndex = 0;
            }

            var next = divs.eq(nextIndex);

            next.stop().fadeIn(1500, function() {
                jQuery(this).addClass("current");
            });

            current.stop().fadeOut(1500, function() {
                jQuery(this).removeClass("current");
                _startProgress();
                setTimeout(fade, 8000);
            });
        }

        function _startProgress() {
            jQuery(".cbp-qtprogress").removeAttr("style");
            jQuery(".cbp-qtprogress").animate({
                    width: "98%",
                },
                8000
            );
        }

        _startProgress();
        setTimeout(fade, 8000);
 });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <div id="cbp-qtrotator" class="cbp-qtrotator">
        <div class="cbp-qtcontent current">
            <div class="content-title">Slide 1</div>
            <p>
                Datacenter | Cloud | Telco | Security | Manufacturing
            </p>
            <footer>
                <div class="btn-group resp_button" role="group">
                    <button type="button" id="downloadbrochure" class="btn btn-default db">Download Brochure</button>
                    <button type="button" class="btn btn-default lgs surveypp popmake-41827">Let’s Get Started >></button>
                </div>
            </footer>
        </div>

        <div class="cbp-qtcontent">
            <div class="content-title">Slide 2</div>
            <p>
                Offshore | Onsite | BOT | Staff Augmentation
            </p>
            <footer>
                <div class="btn-group" role="group">
                    <button type="button" id="engagement" class="btn btn-default db">Our Engagement Models</button>
                    <button type="button" id="seework" class="btn btn-default lgs">See our Work >></button>
                </div>
            </footer>
        </div>

        <div class="cbp-qtcontent">
            <div class="content-title">Slide 3</div>
            <p>
            The inaugural ceremony, along with the press meet, and dinner party was a grand celebration.
            </p>
            <footer>
                <div class="btn-group" role="group">
                    <button type="button" id="readindorepr" class="btn btn-default db">Read the full story in this PR</button>
                </div>
            </footer>
        </div>

        <span class="cbp-qtprogress"></span>
    </div>
<style>
    .cbp-qtrotator {
    width: 100%;
    height: 180px;
    position: relative;
    float: left;
    margin: 0;
    padding-top: 11px
    }
    .cbp-qtcontent {
    width: 100%;
    height: auto;
    position: absolute;
    min-height: 180px;
    top: 0;
    z-index: 2;
    display: none
    }
    .cbp-qtrotator .cbp-qtcontent.current {
    display: block;
    }
    .cbp-qtrotator {
    margin: 40px 0 0 0;
    padding: 0
    }
    .cbp-qtrotator p {
    font-size: 1.2em;
    color: #2D2D2D;
    font-weight: 300;
    margin: 0.4em 0 1.5em
    }
    .cbp-qtrotator footer {
    font-size: 1.2em
    }
    .cbp-qtrotator footer:before {
    content: ''
    }
    .cbp-qtrotator .cbp-qtcontent img {
    float: right;
    margin: 50px 0 0 50px
    }
    .cbp-qtprogress {
    position: absolute;
    background: #fca600;
    height: 2px;
    width: 0%;
    z-index: 1000;
    }
    .cbp-qtrotator .cbp-qtcontent .content-title{
    font-size: 2.2em;
        letter-spacing: -1px;
        line-height: 1.5em;
        margin-top: 30px;
        margin-bottom: 30px;
        color: #212121;
        font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
        text-transform: capitalize;
        font-weight: 600;
    }
</style>

我想使进度条工作的所有三张幻灯片正确，我不明白为什么它不工作后，第二张幻灯片。
任何帮助都感激不尽。