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

    <div id="project05" class="carousel slide">              
              <!-- Carousel items -->
              <ol class="carousel-inner">
                <li class="item home active">
                </li>
                <li class="item about">
                </li>
                <li class="item solutions">
                </li>
                <li class="item approach">
                </li>
              </ol>
              <!-- Carousel nav -->
              <ol class="carousel-linked-nav">
                <li class="active"><a href="#1">Home</a></li>
                <li><a href="#2">About</a></li>
                <li><a href="#3">Solutions</a></li>
                <li><a href="#4">Approach</a></li>
              </ol>
              <a class="carousel-control left" href="#project05" data-slide="prev">&lsaquo;</a>
              <a class="carousel-control right" href="#project05" data-slide="next">&rsaquo;</a>
            </div>

Here is the answer for what i was looking for, for those who might want to know.

    function carouselSlide() {
    $('#exterior-page .carousel').bind('slid', function() {
      $('#exterior-page.carousel-linked-nav .active').removeClass('active');
      var idx = $('#exterior-page .carousel .item.active').index();
      $('#exterior-page .carousel-linked-nav li:eq(' + idx + ')').addClass('active');
      if(idx === 0) {
          // alert("home page");
          $("#main-nav").removeClass();
          $("#main-nav").addClass('home-color');
        }
        else if(idx === 1) {
           // alert("about page");
           $("#main-nav").removeClass();
           $("#main-nav").addClass('about-color');
        }
        else if(idx === 2) {
           // alert("solutions page");
           $("#main-nav").removeClass();
           $("#main-nav").addClass('solutions-color');
        }
        else if(idx === 3) {
           // alert("approach page");
           $("#main-nav").removeClass();
           $("#main-nav").addClass('approach-color');
        }
    });
  }

Answer 1

Try

if ($activeItem.is('.about.active')) {
    alert("slide4 about is selected");
}

I didn't include item because it is used in the selector to select $activeItem so if an item is selected it will already have that class. If sometime later you want to test for the 3 classes when perhaps the classes of the elements could change use if ($activeItem.is('.about.active.item')){

Note is will return true if any li has the classes, if you want to test on an individual basis then

$activeItem.each(function(){
    if ($(this).is('.about.active')) {
        alert("slide4 about is selected");
    }
});

Answer 2

& $activeItem.hasClass('active')

supposed to be

&& $activeItem.hasClass('active')

Condition has to use double &

Your if should look like this

 if ($activeItem.hasClass('about') && $activeItem.hasClass('active') 
                                   && $activeItem.hasClass('item')) {