title: Twitter Bootstrap - Control multiple carousels with 1 set of carousel indicators
body: <p>How would you go about controlling 2 Bootstrap carousels on one page, with only 1 set of carousel indicators? At the moment, I have both carousels set-up using the same '<code>.carousel</code>' class. When the user clicks the next or previous controls, the slide events on both carousels execute simulaneously.</p>
  
  <p>I'm attempting to bind the slide event to the carousel indicators, which are nested in the main carousel. The desired result would be to bind the slide event to the ID of the second carousel, so that both next/previous slide events are exactly the same. Here's what I have so far:</p>
  
  <pre><code>$(document).ready(function(){
    $('.carousel-indicator li').click('slide', function() {
      $('#project-carousel-phone').bind().carousel();
    });
  });
  </code></pre>
  
  <p>I suck at Javascript, so any direction here would be greatly appreciated. Thanks!</p>