how to restore the list element style on clicking other elem

You can loop through the element siblings and change the style accordingly like:

element.onclick = function (event) {

element.style.color = "red";

var sib = getSiblings(element);

for (var i = 0; i < sib.length; i++) {

sib[i].style.color = "black";

}

};

getSiblings function code:

function getChildren(n, skipMe) {

var r = [];

for (; n; n = n.nextSibling)

if (n.nodeType == 1 && n != skipMe) r.push(n);

return r;

};

function getSiblings(n) {

return getChildren(n.parentNode.firstChild, n);

}

Demo: http://jsfiddle.net/o0xw3gys/