Question

I’ve been trying to hide the Bootstrap Carousel left and right buttons if only one slider is present but can’t seem to get it to work properly.

I’ve tried

    if ($('.carousel-inner div').length === 1 ) { 
        $(this).find('.controls .carousel-control').hide();
    }

and

    if($('.carousel-inner .item').is(':only-child')) {
    $(this).find('.controls .carousel-control').hide();

Without any luck.

Is there a particular reason why neither of these would work? The console returns the correct number of sliders for .length and I use the exact same .hide method on a different function dealing with this carousel.

Answer 1

Instead of $(this).find(...).hide(); try $('.controls .carousel-control').hide();