javascript - How can I apply a jQuery function to all elements with the same ID?

Question

I am new to jQuery. I have the following code:

jQuery(document).ready(function() {
    jQuery('#carousel').jcarousel();
});

It only applies to the first ul with id="carousel", not for the others. How can I apply it to all elements which have the same ID?

HTML:

<!-- jQuery applies to this div -->
<div id="slideshow-carousel">
    <ul id="carousel" class="jcarousel jcarousel-skin-tango">
        <!-- ... -->
    </ul>
</div>

<!-- jQuery does not apply for this div -->
<div id="slideshow-carousel">
    <ul id="carousel" class="jcarousel jcarousel-skin-tango">
        <!-- ... -->
    </ul>
</div>

Answer 1

You can't have more than one element with the same Id, that's why is not working. You should use class="caroussel" instead.

jQuery(document).ready(function() {
    jQuery('.carousel').jcarousel();
});