how to restore the list element style on clicking other elem

Question

I am creating list elements dynamically and the  list element color should change when we click on it,.

 this  functionality am getting through the following code:

 

function addLeaf(sText) {

var element = null;

try {

element = document.createElement("li");

element.innerText = sText;

element.style.cursor = "pointer";

element.onclick = function (event) {

element.style.color = "red";

};

 

 

 

 

but when i clicked another list element ,the first clicked list element should become normal ie,.in black color,.

 

 

if  anyone can help