Dynamically create javascript link

Question

I am trying to set my text as a link so that when I click on it the function will execute. Right now I just installed it for google.com to try to get the text as a link, but it seems to be doing nothing at all. This is just static text. Any suggestions?

var leftDiv = document.createElement("div"); //Create left div leftDiv.id = "left"; //Assign div id leftDiv.setAttribute("style", "float:left; width:66.5%; line-height: 26px; text-align:left; font-size:12pt; padding-left:8px; height:26px;"); //Set div attributes leftDiv.style.background = divColor; a = document.createElement('a'); a.setAttribute('href', 'google.com'); user_name = a.appendChild(document.createTextNode(fullName + ' ')); leftDiv.appendChild(user_name); // Add name to left div 

Answer 1

Take a look at this example:

http://jsfiddle.net/ajXEW/

I added some comments inside the code that explain the different steps.

  var leftDiv = document.createElement("div"); //Create left div leftDiv.id = "left"; //Assign div id leftDiv.setAttribute("style", "float:left; width:66.5%; line-height: 26px; text-align:left; font-size:12pt; padding-left:8px; height:26px;"); //Set div attributes leftDiv.style.background = "#FF0000"; a = document.createElement('a'); a.href = 'google.com'; // Insted of calling setAttribute a.innerHTML = "Link" // <a>INNER_TEXT</a> leftDiv.appendChild(a); // Append the link to the div document.body.appendChild(leftDiv); // And append the div to the document body 

Answer 2

Try the following: http://jsfiddle.net/HknMF/5/

 var divColor = "red"; var fullName = "bob"; var leftDiv = document.createElement("div"); //Create left div leftDiv.id = "left"; //Assign div id leftDiv.setAttribute("style", "float:left; width:66.5%; line-height: 26px; text-align:left; font-size:12pt; padding-left:8px; height:26px;"); //Set div attributes leftDiv.style.background = divColor; a = document.createElement('a'); a.setAttribute('href', 'google.com'); a.appendChild(document.createTextNode(fullName + ' ')); leftDiv.appendChild(a); // Add name to left div document.body.appendChild(leftDiv);