im working on a project which there is multiple menu selection on tab which i need to onclick on each tab menu will display different type of menuFood. As my jquery not working on the function with onclick and the tab will add class "on" and the display of the table will be different. Kindly advice

html：

```
<div class="tab" data-type="wx" data-desc="整合"> 
    <span data-type="wx" class="on">整合</span>
    <span data-type="sx">第一球</span>
    <span data-type="qsm">第二球</span>
    <span data-type="zsm">第三球</span>
    <span data-type="hsm">第四球</span>
    <span data-type="em">第五球</span> 
</div>

```

jquery：

```
<script type="text/javascript">
     $(document).ready(function(){  
         $('.tab span').each(function(){  
            if($($(this))[0].href==String(window.location))  
                $(this).parent().addClass('on');  
         });  
     })  
</script> 

```