hello

On tab hover

After the click I lose the scc over,

On the below code I get the hover on all the elements at ones but I need to get hover per 1 element

1.  
2. <style type="text/css">
3.         div.tabArea { font-size: 80%; font-weight: bold; z-index:199; position:relative;}
4.         a.tab { background-color: #f0f0f0; border: 1px solid #000000; border-bottom-width: 0px; padding: 2px 1em 2px 1em; text-decoration: none; color: #808080;}
5.         /*.activeTab { color: White; }*/
6.         a.tab:hover { background-color: #d0d0d0; color: #606060; }
7.         .div_contantRapper{ border: solid 1px black; border-collapse: collapse; border-radius: 5px; -moz-border-radius: 5px; padding: 5px; width: 500px; height: 300px; display: inline-block; background-color: #d0d0d0; }
8.         .divContent{display:none; height:275px;  border:inset 1px gray; margin:5px;padding:5px; background-color:White;}
9.     </style>
11. <div class="tabArea">
12.         <a id="tab1" class="tab" href="#">Tab A</a> 
13.         <a id="tab2" class="tab">Tab B</a> 
14.         <a id="tab3" class="tab">Tab C</a> 
15.         <a id="tab4" class="tab">Tab D</a>
16.     </div>
17.     
18. <script type="text/javascript">
19.     $(".tab").click(function()
20.     {
21.         $('a[id*="tab"]').css("color", "#808080").css("background-color", "#f0f0f0")
22. //        .hover(function()
23. //        {
24. //            $('a[id*="tab"]').css("background-color", "#d0d0d0")
25. //        },
26. //        function() { $('a[id*="tab"]').css("background-color", "#f0f0f0") }
27.         //        )
28. ;
29.         
30. 
    
31.         $(this).css("color", "White").css("background-color", "#d0d0d0")
32. 
    
33.