Dynamic menu items (change text on click)
<p>i need some help with a menu. See the following menu:</p>

<p><a href="http://cl.ly/8b2c7dcabbe12e2200db" rel="nofollow">menu</a></p>

<p>The code for this menu:</p>

<pre><code>    &lt;div id="menu"&gt;
  &lt;ul&gt;
   &lt;li class="home"&gt;&lt;a href="#home" class="panel"&gt;home / &lt;span class="go"&gt;you are here&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
   &lt;li class="about"&gt;&lt;a href="#about" class="panel"&gt;about / &lt;span class="go"&gt;go here&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
   &lt;li class="cases"&gt;&lt;a href="#cases" class="panel"&gt;cases / &lt;span class="go"&gt;go there&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
   &lt;li class="photos"&gt;&lt;a href="#photos" class="panel"&gt;photos / &lt;span class="go"&gt;maybe here&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
   &lt;li class="contact"&gt;&lt;a href="#contact" class="panel"&gt;contact / &lt;span class="go"&gt;or even here&lt;span&gt;&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
 &lt;/div&gt;
</code></pre>

<p>What i want to do: onclick a menu item:
1. change the red text to yellow 'you are here'
2. change the previous menu item back to its original state (eg red and "go here").</p>

<p>The 4 values "go here", "go there", "maybe here", "or even here" are the 4 values that should be assigned to the other menu items (like the example). </p>

<p>This is the code i already have:</p>

<pre><code>$('#menu ul li.home').addClass('active')
$('#menu ul li.active a .go').html("you are here");

$("#menu ul li").click(function () { 
$('#menu ul li.active').removeClass('active');
     $(this).addClass('active');
     $('#menu ul li.active a .go').html("you are here");
  });

  var arr = [ "go here", "go there", "maybe here", "or even here" ];
  var obj = { item1: "go here", item2: "go there" ,item3: "maybe here", item4: "or even here"};

  $('#menu ul li').click(function () {
   var str = $('#menu ul li.active a .go').text();
   $('#menu ul li.active a .go').html(str);
  });
</code></pre>

<p>As you see, it's incomplete. I don't how to get the values from the array and assign them too a menu item. The replace text works, but not the change-back-to-original-state. Also, right now, for some reason i can't click ONTO the list item itself in order to activate the jquery code. I need to click just a few pixels under it. But i guess that's a css issue.</p>

<p>If anyone can help, i'd be super thankful!</p>

<p>Regards,</p>

<p>Mathijs</p>
