How to remove and add a new css class with jQuery?
<p>Here is my example</p>

<pre><code>&lt;a href="javascript:void(0)" id="ctl00_ctl00_cphContent_cphInnerContent_ViewPhotosCtrl_ddRating_A" title="10" style="text-decoration:none"&gt;&lt;span id="ctl00_ctl00_cphContent_cphInnerContent_ViewPhotosCtrl_ddRating_Star_1" class="ratingStar emptyRatingStar" style="float:left;"&gt;&amp;nbsp;&lt;/span&gt;&lt;span id="ctl00_ctl00_cphContent_cphInnerContent_ViewPhotosCtrl_ddRating_Star_2" class="ratingStar filledRatingStar" style="float:left;"&gt;&amp;nbsp;&lt;/span&gt;&lt;span id="ctl00_ctl00_cphContent_cphInnerContent_ViewPhotosCtrl_ddRating_Star_3" class="ratingStar filledRatingStar" style="float:left;"&gt;&amp;nbsp;&lt;/span&gt;&lt;span id="ctl00_ctl00_cphContent_cphInnerContent_ViewPhotosCtrl_ddRating_Star_4" class="ratingStar filledRatingStar" style="float:left;"&gt;&amp;nbsp;&lt;/span&gt;&lt;span id="ctl00_ctl00_cphContent_cphInnerContent_ViewPhotosCtrl_ddRating_Star_5" class="ratingStar filledRatingStar" style="float:left;"&gt;&amp;nbsp;&lt;/span&gt;
&lt;/a&gt;
</code></pre>

<p>so I need to remove ratingStar filledRatingStar class on click from all child elements of anchor tab and apply a different class ratingStar emptyRatingStar</p>
