Member Avatar for newbie14

Dear All,
I have a page here http://183.78.169.54/tree/2.html. What I want to control is that for link on the left that is clicked I want the text to change to a particular color to highlighted it have been selected. And when another linked is clicked I want the previous linked to be reset to the normal color. How to achieve that.

  • 3 Contributors
  • 2 Replies
  • 517 Views
  • 16 Hours Discussion Span
  • Latest Post Latest Post by malini1211@gmai
Member Avatar for Amr87

Hope This Helps

<!DOCTYPE html>
<html>
<head>
 
<style>
a {display:block;}
a.clicked {
background:#ccc;
text-decoration:none;
color:#f00;
}
</style>
</head>
<body>
    <ul>
    <li><a id="" href="#">LINK 1</a></li>
	<li><a id="" href="#">LINK 1</a></li>
	<li><a id="" href="#">LINK 1</a></li>
     </ul>


   <script type="text/javascript">
	window.onload = SetAction();
	function SetAction() {
    var allLinks = document.getElementsByTagName("A");
    for (var i=0;i<allLinks.length;i++){
	if (allLinks[i].parentNode.nodeName == "LI") {
	allLinks[i].onclick = function (){
	for (var j=0;j<allLinks.length;j++) {
	if (allLinks[j].className != "") {
	allLinks[j].className ="";
	}
  this.className = "clicked";}
}

}
}
	}
	
     
    </script>
</body>

</html>

This Script is applied to All Links thats is direct child of List Item (li) (which is applicable for your site )
you can manipulate the style added for the clicked link by manipulating the class "clicked" defined in the style tag in the head section

Edited by Amr87 because: n/a
Member Avatar for malini1211@gmai

Hi I dont know who You are.I am a beginner.Just now I have seen this website.You have helped many of them even you didnt even know who they are.This is very helpful to all. I like your helping nature.I have just one word to say.god is always with you.God may fulfil all your desire and wishes.greetings to peace.Thank You so much.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.