Use JavaScript to style a link by changing its class attribute
<p>Edit: I suspect the problem has to do that since all my # anchors are on the same page, unless I reload the page, JavaScript just doesn't know about my clicks on the link. I don't know how to solve this problem though...:(</p>

<p>I'm trying to make a clicked link stay blue if the section it points to is shown. This is the code (I put the Javascript code just before the closing body tag as suggested by <a href="http://tycoontalk.freelancer.com/javascript-forum/155444-quick-tip-how-make-active-links.html" rel="nofollow">this tutorial</a>).</p>

<p>HTML</p>

<pre><code>&lt;ul id="menu"&gt;
    &lt;li&gt;&lt;a href="#section1"&gt;section1&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#section2"&gt;section2&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#section3"&gt;section3&lt;/a&gt;&lt;/li&gt;
</code></pre>

<p>JavaScript</p>

<pre><code>links = document.getElementById("menu").getElementsByTagName("a");

for(i=0; i&lt;links.length;i++) {
   if(links[i].href == window.location.hash) {
   links[i].className = "active";
    }
}
</code></pre>

<p>CSS</p>

<pre><code>a.active {
    color:blue;
}
</code></pre>

<p>However it does not seem to work. Can anyone help? Thanks!</p>
