hello i have a ul
<ul>
<li><a class="facebook"
href="javascript:void(0);"><i class="fa fa-facebook"></i></a></li>
<li><a class="twitter"
href="javascript:void(0);"><i class="fa fa-twitter"></i></a></li>
<li><a class="linkedin"
href="javascript:void(0);"><i class="fa fa-linkedin"></i></a></li>
<li><a class="googleplus"
href="javascript:void(0);"><i class="fa fa-google-plus"></i></a></li>
<li><a class="pinterest"
href="javascript:void(0);"><i class="fa fa-pinterest-p"></i></a></li>
</ul>
and I want to add different background color to different li like
blue for facebook red for google when I click on them but when I click
on other li I want them return to their original color kind of like of
active class but I want different color or class for each li.
I tried addclass and remove class but I cant figure how to add
and remove multiple classes or css properties of li.