php - How to remove class of li if there is using multiple classes in li -


the html code

echo  "<ul id='sub'>"; if($set == null){  echo '<li class="blankseat" ></li>'; } 

if in database status yes or no add class in red color

elseif($status == 'no' || $status == 'yes'){ echo '<li class="occupied" title="row'.$val1.'" name="'.$val2.'"  value="'.$val3.'"></li>';   }  elseif($name=='pink'){ echo '<li class="pink" title="row'.$val1.'" name="'.val2.'"  value="'.$val3.'"></li>'; } elseif($name=='yellow'){ echo '<li class="yellow" title="row'.$val1.'" name="'.$val2.'"  value="'.$val3.'"></li>';  } else{  echo '<li class="orange" title="row'.$val1.'" name="'.$val2.'"   value="'.$val3.'"></li>';  } echo "</ul>";    } echo '</div>'; } else {  echo "no result available";  } 

this code

$('li').click(function(e) { var $this = $(this); 

first part iam adding class when click on 1 of them

if($(this).hasclass('pink')|| $(this).hasclass('yellow') ||  $(this).hasclass('orange')) { $(this).addclass('booked').removeclass('pink','yellow','orange'); } 

here want remove booked class 1 clicked

else { $(this).addclass('pink').removeclass('booked'); $(this).addclass('yellow').removeclass('booked'); $(this).addclass('orange').removeclass('booked'); }} 

try this:

$(document).on("click", "li", function(e) {     if($(this).hasclass('pink')|| $(this).hasclass('yellow') || $(this).hasclass('orange')){        $(this).toggleclass("booked")        console.log($(this).attr("class"))     }  })
.pink{    background-color:pink;  }  .yellow{    background-color:yellow;  }  .orange{    background-color:orange;  }  .booked{    background-color:red;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <ul id='sub'>    <li class="blankseat"> item 3</li>    <li class="occupied"> item 3</li>    <li class="pink"> item 3</li>    <li class="yellow"> item 4</li>    <li class="orange"> item 5</li>  </ul>


Comments

Popular posts from this blog

angular - Ionic slides - dynamically add slides before and after -

minify - Minimizing css files -

Add a dynamic header in angular 2 http provider -