To accomplish this, I am using jQuery click function and setting and reading cookies to change my CSS.  The cookie plugin I am using can be found here:  http://dangelmayer.com/js/jquery.cookie.js

2. <script> 
3.         $(document).ready(function() { 
5. $("#pnav a").click(function(e) { 
6. e.preventDefault();  //force link to go via javascript handling cookies first
8. //remove existing cookie on host computer
9. if ($.cookie('css') != null ) {                                       
10. alert('Removing Cookie on click = '+$.cookie('css')); 
11. $.cookie("css", null, {path: '/'});                                    
12. } 
13.                                        // Setting value for cookie and redirecting to clicked link
14. var linkto = $(this).attr('href');
15. var target = $(this).closest('li.primary').find('img.grey').attr("id");
16. $.cookie('css', target, {path: '/'});
17. alert('Setting Cookie on click = '+$.cookie('css'));
18. alert('Going to page = '+linkto);                                  
19. window.location = linkto;
20. //} 
21. });
22.                         // Special case, if home page is clicked, remove red image in prim. nav.
24. var locatepath = $(location).attr('pathname');
25. if (locatepath == '/index_new.php') {
26. $.cookie("css", null, {path: '/'});
27. alert('Removing Cookie on click = '+$.cookie('css')); 
28. }
29. 
    
30.                         //Finally, read cookie and change selected primary navigation to red
32. if($.cookie('css')) {                                       
33. $('#'+$.cookie('css')).css('display', 'none'); 
34. alert('Retrieving Cookie for Primary navigation = '+$.cookie('css'));         
35. } 
37.         }); 
38.     </script>

and an example section of the primary navigation is below.  Clicking on any link here will create a cookie with the value " daadvg".

3.         <nav id="topnav">          
4.             <ul id="navmenu" class="sf-menu">         
5.                    <li id="pnav" class="primary daadv">
6.                 <a class="menusd homex" href="http://www.dangelmayer.com/index_new.php" title="The Dangelmayer Advantage" target="_self" onmouseover="this.title='';" style="padding-top:10px;"><span class="primnavtxt">The Dangelmayer<br />Advantage</span></a>
7.                 <img src="/images/new/nav_prim_grey.png"      style="width:136px;" class="grey" id="daadvg" alt="" />
8.                 <img src="/images/new/nav_prim_hover_red.png" style="width:136px;" class="red" alt="" />  
9.                     <ul>
10.                          <li><a href="http://dangelmayer.com/dream-team.php" title="Dangelmayer Associates Dream Team" rel="_self" onmouseover="this.title='';">Dream Team <span class="sf-sub-indicator"> &#187;</span></a>
11.                         <ul>
12.                             <li><a href="http://dangelmayer.com/dream-team.php" title="Dangelmayer Associates Dream Team" rel="_self" onmouseover="this.title='';">Team Biographies</a></li>
13.                                 <li><a href="http://dangelmayer.com/achievements.php" title="Dangelmayer Associates Achievements" rel="_self" onmouseover="this.title='';">Team Achievements</a></li>
14.                             </ul>                         
15.                          </li>
16.                          <li><a href="http://dangelmayer.com/mission-statement.php" title="Dangelmayer Associates philosophy/approach (reputation/no conflict of interest)" rel="_self" onmouseover="this.title='';">Philosophy</a></li>
17.                          <li><a href="http://dangelmayer.com/customer-base.php" title="Dangelmayer Associates Customer Base (long-term happy customers)" rel="_self" onmouseover="this.title='';">Customer Base</a></li> 
18.                          <li><a href="http://dangelmayer.com/company-locations.php" title="Dangelmayer Associates Worldwide Coverage" rel="_self" onmouseover="this.title='';">Worldwide Coverage</a></li>                                            
19.                     </ul>                 
20.                 </li>
22.           </ul>
23.         </nav>

Issue:

Should work like:

Clicking on a link will delete the old cookie  (redundant, but done because of this issue), (only one cookie name exist), create a new cookie and then redirect user to their requested new page, read the new cookie value, then set the selected primary navigation to red based on that value.

But get this strange behavior:

This works sometimes, but others, it pulls values of this cookie that are 2 or 3 deleted cookies prior.  I am not sure how jQuery stores the cookie value (in browser session?), but somehow it is not really deleting or reading the correct cookie (appears to be a random problem).

Right now, for diagnostics, I have all the JavaScript alerts on so you can see the stages of cookie handling.

Any help would greatly be appreciated.

Thank you!