html - Jquery removeClass, addClass -

i having poblems removeclass , addclass function. trying change font awesome class when dropdown clicked open. have attempted several times make work think must overlooking something.

here html code:

<div id="cssmenu"class="col-xs-12 left">     <ul class="nav nav-sidebar">        <li><a href='#'><span>dashboard</span></a></li>        <li class='active has-sub'><a href='#'><span>products</span><i class="fa fa-caret-right"></i> 

and here jquery code trying delete class , add one:

$('#cssmenu ul li i').on('click', function() {     $('#cssmenu ul li i').removeclass('fa-caret-right');     $(this).addclass('fa-caret-down'); }); 

thanks having :) btw looking clues , not answers, since trying learn jquery.

i add click event on list item:

$('#cssmenu ul li').on('click', function() {         $('#cssmenu ul li i').removeclass('fa-caret-right');         $(this).find('i').addclass('fa-caret-down'); });