Estaba buscando cómo crear un carrusel Bootstrap con miniaturas, y me encontré con esto:http://jsfiddle.net/xuhP9/67/

$('#myCarousel').carousel({
interval: 4000
});

$('[id^=carousel-selector-]').click(function () {
 var id_selector = $(this).attr("id");
 var id = id_selector.substr(id_selector.length - 1);
 id = parseInt(id);
 $('#myCarousel').carousel(id);
 $('[id^=carousel-selector-]').removeClass('selected');
 $(this).addClass('selected');
});

$('#myCarousel').on('slid', function (e) {
 var id = $('.item.active').data('slide-number');
 id = parseInt(id);
 $('[id^=carousel-selector-]').removeClass('selected');
 $('[id^=carousel-selector-' + id + ']').addClass('selected');
});

Lo que funciona bien, sin embargo, necesito tener varios carruseles en una página, y no estoy muy seguro de cómo puedo lograrlo. Estoy cansado de cambiar el selector de id a un selector de clase para poder crear más de uno. Pero no estoy seguro de cómo arreglar realmente la funcionalidad JS para que funcione, ya que parecen estar cegados juntos.

Básicamente, esto es lo que estoy tratando de lograr:http://jsfiddle.net/xuhP9/70/ pero sin repetir el JS para cada carrusel independiente que creo.

¡Gracias por adelantado!