самозагрузка 3-х состояния глификонов при нажатии

Помогите, я хочу, чтобы при загрузке 3. Свернуть изображение глификона. Я нашел эту тему здесьBootstrap 3 Свернуть показать состояние с иконкой Chevron Это работает в jsfiddle, но при копировании на мою собственную страницу происходит сворачивание, но значок не перемещается сверху вниз. Есть ли что-то, что мне не хватает? Я даже поместил это в полную загрузочную версию Bootstrap 3, и значок не может поменяться. Вот код:

<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
  <h4 class="panel-title">
    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
      Collapsible Group Item #1 
    </a><i class="indicator glyphicon glyphicon-chevron-down  pull-right"></i>
  </h4>
</div>
<div id="collapseOne" class="panel-collapse collapse in">
  <div class="panel-body">
    Anim pariatur cliche reprehenderit, enim eiusmod high...
  </div>
</div>
</div>
</div>
</div>

и вот JS:

$('#accordion .accordion-toggle').click(function (e){
var chevState = $(e.target).siblings("i.indicator").toggleClass('glyphicon-chevron-down       glyphicon-chevron-up');
$("i.indicator").not(chevState).removeClass("glyphicon-chevron-down").addClass("glyphicon-chevron-up");
});

Ответы на вопрос(1)

Ваш ответ на вопрос