How to check if an item has three specific class's and if so do this

Question

Trying to do an if statement that detects if a list item has the class 'about' 'active' and 'item' assigned to it. every post i have read is to check if the item has one of the three classes. i want to know when the item has all three classes. Please any help would be helpful thank you. This is what i have so far ``` var $activeItem = $("#project05 ol.carousel-inner li.item"); if ($activeItem.hasClass('about') & $activeItem.hasClass('active') & $activeItem.hasClass('item')) { alert("slide4 about is selected"); } ``` HERE IS THE HTML ```

Home
About
Solutions
Approach

Accepted Answer

As Musa's answer has already my upvote, but here's a little addition as it is was missing this case:

Your selector can return multiple items if the class `item` is present on more than one `<li>`-element. In this case:

```
if ($activeItem.is('.about.active')) {}
```

will always return `true` if at least one element has the specific classes. If multiple entries can have the class `item` you can check the result in a loop like this:

```
$.each($activeItem, function(key, value) {
    if ($(value).is('.active')) {
        alert ('Slide ' + key + ' is selected');
    }
});
```

OR

Another idea is to select the element directly and to get the index like this:

```
var selected = $('ul li.active').index();
```

You can add `+ 1` to the `key` or to the statement right above if you want as both values are zero-based.

Demo

Try before buy

Edit

It seems, that you're using Twitter BootStrap Carousel. If it is the case, you can bind the `slid`-event, which fires after each action (like clicking the prev/next buttons or using the navigtion). This should do the trick:

```
$('.carousel').bind('slid', function() {
    var selected = $('ul li.active').index();
});​
```

How to check if an item has three specific class's and if so do this

Solution

Problem