Bootstrap carousel for text only not working as expected

I'm trying to use carousel to display some announcement topics on my website. but, the carousel just not displayed correctly. now, the topics inside the carousel are updated every day so I'm using javascript to add the item dynamically.

this is the code that I'm using :

HTML

<script src="static/js/jquery.min.js"></script>
<script src="static/js/bootstrap.min.js"></script>
<div id="announcement-container" class="alert alert-warning">
  <div class="announcement-button-left">
    <a class="carousel-control-prev" href="#text-carousel" role="button" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
    </a>
  </div>
  <div class="announcement-carousel">
    <div id="text-carousel" class="carousel slide" data-ride="carousel">
      <div id="announcement" class="carousel-inner">
      </div>
    </div>
  </div>
  <div class="announcement-button-right">
    <a class="carousel-control-next" href="#text-carousel" role="button" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
    </a>
  </div>
</div>

CSS

.carousel-content {
  color:black;
  display:flex;
  align-items:center;
}

#text-carousel {
height: 20px;
padding: 0px;
}

.announcement-container {
display: inline-flex;
}

.announcement-text {
text-align: center;
}

.announcement-button-left {
display: inline;
}

.announcement-carousel {
display: inline-flex;
flex-grow: 1;
}
.announcement-button-right {
display: inline;
}

Javascript

$(document).ready(function () {
for(i = 0; i < topics.length; i++){
  if(i==0){
    $("#announcement").append("<div class='item active'><div class='carousel-content'><div class='announcement'><p class='announcement-text'>" + topics[i][0] + "</p></div></div></div>");
  }else{
    $("#announcement").append("<div class='item'><div class='carousel-content'><div class='announcement'><p class='announcement-text'>" + topics[i][0] + "</p></div></div></div>");
  }
}      
});

result

there's no error either on my console, and as I'm pretty new at bootstrap, I would appreciate any input regarding this.