title: Bootstrap Carousel Pagination active state
body: <p>I have scoured similar questions/answers here, but nothing seems to do the trick for me. My 'active' state is not working completely. It halfway works; it deactivates the first bullet when you select a different one.</p>
  
  <p><strong>Please check out the full code:</strong> <a href="http://jsfiddle.net/cindyg/e9Qum/" rel="nofollow noreferrer">http://jsfiddle.net/cindyg/e9Qum/</a></p>
  
  <p>The code below looks correct to me; not sure what's missing?</p>
  
  <pre><code>.bind('slid',
          function(e) {
              var nav = $('.carousel-nav[data-target="' + $(this).attr('id') + '"] button');
              var index = $(this).find('.item.active').index();
              var item = nav.find('a').get(index);
  
              nav.find('a.active').removeClass('active');
              $(item).find('a').addClass('active');
  </code></pre>
  
  <p>I attempted to use the suggested solutions here:</p>
  
  <ul>
  <li><a href="https://stackoverflow.com/questions/10499154/bootstrap-carousel-number-active-icon">Bootstrap Carousel Number active icon</a></li>
  <li><a href="https://stackoverflow.com/questions/10974724/bootstrap-carousel-pagination-slide-numbering-issue">Bootstrap carousel pagination / slide numbering issue</a></li>
  </ul>
  
  <p>...but they didn't work. Keep in mind I'm a newb and my syntax might have been way off when I tried them.</p>
  
  <p>Thanks all!</p>
  
  <p><strong>EDIT!!!!!!</strong> Somehow I fixed it... I really am not sure what I did, but I'm posting it here in case it helps anyone. However, now I'm having a problem where it's auto-rotating through the slides, even though I removed the "slide" class on the myCarousel div. Any ideas? <a href="http://jsfiddle.net/cindyg/UNKeL/" rel="nofollow noreferrer">on jsfiddle</a></p>
  
  <pre><code>.bind('slid',
                      function(e) {
                              var nav = $('.carousel-nav[data-target="' + $(this).attr('id') + '"] ul');
                              var index = $(this).find('.item.active').index();
                              var item = nav.find('li').get(index);
  
                              nav.find('li a.active').removeClass('active');
                              $(item).find('a').addClass('active');
  </code></pre>