Question

I have some carousel plugin. There is one element which have active class after one by one click. Also all of elements on carousel have classes available or no_available. Now i need to check this active element, and if it have class available do something and if is no_available do something else. This active class and element is changing after carousel click. So i do this, and i have only one condition respond, the first one. Can u help me?

carousel_images = $("#ajax-carousel"),
carousel_images_active_element = carousel_images.find("li.active");

carousel_controls_button.live('click', function(e){
    if (carousel_images_active_element.is('.available')){
        console.log('run_01');
        bottom_panel.fadeOut('fast');
    }
    else if (carousel_images_active_element.is('.no_available')){
        console.log('run_02');
    }
});

html

<ul>
   <li id="01" class="active no_available"></li>
   <li id="02" class="available"></li>
   <li id="03" class="available"></li>
   <li id="04" class="no_available"></li>
</ul>

Much thx.

Answer 1

Now i need to check this active element, and if it have class available do something and if is no_available do something else.

use hasClass()

try this

carousel_controls_button.on('click', function(e){
   if (carousel_images_active_element.hasClass('available')){
     console.log('run_01');
     bottom_panel.fadeOut('fast');
   }
   else if (carousel_images_active_element.hasClass('no_available')){
    console.log('run_02');
 }
});

live() deprecated use on()