MY Jquery Code:
$('a#cusine1').on('click', function(){
$('div#product-list').html("LOADING..........").show();
$(".ccid").addClass("0");
document.getElementById("ccid1").className="active2";
});
$('a#cusine2').on('click', function(){
$('div#product-list').html("LOADING..........").show();
$(".ccid").addClass("0");
document.getElementById("ccid2").className="active2";
});
$('a#cusine3').on('click', function(){
$('div#product-list').html("LOADING..........").show();
$(".ccid").addClass("");
document.getElementById("ccid3").className="active2";
});
MY HTML CODE
<li id="ccid1" class="ccid">
<a href="#" id="cusine1"><i class="fa fa-ticket"></i>3 Star Hotel</a> </li>
<li id="ccid2" class="ccid">
<a href="#" id="cusine2"><i class="fa fa-ticket"></i>3 Star Hotel</a> </li>
<li id="ccid3" class="ccid">
<a href="#" id= "cusine3"><i class="fa fa-ticket"></i>5 Star Hotel</a>
</li>
OUTPUT NEEDED:
I need, when li
id "ccid1" is clicked, the class "active2" should be added. other li
should have only "ccid" class.
The number of li
may change based on the PHP.
PROBLEM FOUND
In first time, when click li
id "ccid1", the class "active2" is added. Then, if the li
id "ccid2" clicked the class "active2" is added, but the li
id "ccid1" class not set to "0".
name0
orunselected
or whatever descriptive.active2
class will jump from one to another? Because if you click all 3, then all 3 will have the classactive2
.