Change color of content of `<li>` tag when selected

This is my list:

<ul id="list">
<li id="g_commondata" value="g_commondata.html">
    <a onclick="setPictureFileName(document.getElementById('g_commondata').getAttribute('value'))">Variable : g_commondata</a>
</li>
<li id="gs_data" value="gs_data.html">
    <a onclick="setPictureFileName(document.getElementById('gs_data').getAttribute('value'))">Variable : gs_data</a>
</li>
<li id="leak" value="leak.html">
    <a onclick="setPictureFileName(document.getElementById('leak').getAttribute('value'))">Variable : leak</a>
</li>
<li id="Dfun1" value="Dfun1.html">
    <a onclick="setPictureFileName(document.getElementById('Dfun1').getAttribute('value'))">Function : Dfun1</a>
</li>
<li id="main" value="main.html">
    <a onclick="setPictureFileName(document.getElementById('main').getAttribute('value'))">Function : main</a>
</li>
<li id="Afun1" value="Afun1.html">
    <a onclick="setPictureFileName(document.getElementById('Afun1').getAttribute('value'))">Function : Afun1</a>
</li>
<li id="Afun2" value="Afun2.html">
    <a onclick="setPictureFileName(document.getElementById('Afun2').getAttribute('value'))">Function : Afun2</a>
</li>
<li id="Afun3" value="Afun3.html">
    <a onclick="setPictureFileName(document.getElementById('Afun3').getAttribute('value'))">Function : Afun3</a>
</li>
<li id="Afun4" value="Afun4.html">
    <a onclick="setPictureFileName(document.getElementById('Afun4').getAttribut开发者_运维技巧e('value'))">Function : Afun4</a>
</li>
</ul>

How can I change the color of the selected item at run time?

---

This may solve your problem:

CSS:

.text_color {color:red}//Choose your color

JQUERY:

$('#list li').click(function(){
     $(this).parent().find('li.text_color').removeClass('text_color');
     $(this).addClass('text_color');
    });

---

In vanilla JavaScript:

<li id="g_commondata" value="g_commondata.html">
    <a onclick="setPictureFileName(document.getElementById('g_commondata').getAttribute('value')); this.parentNode.style.color = '#FF0000';">Variable : g_commondata</a>
</li>

Likewise for all <LI>. I recommend that you learn and start using a JavaScript library such as jQuery, Prototype or MooTools.