Creating an unordered list in a DIV

Question

I have a div. I want to dynamically generate a bulleted list inside a DIV using jQuery with the list of elements that I have with me.

for (cnt = 0; cnt < someList.length; cnt++) { someList[cnt].FirstName + ":" + someList[cnt].LastName + "<br/>" // what to write here? } 

Answer 1

Keeping things as simple as possible. Using your existing javascript, you just need to add this:

 $('#myDiv').append("<ul id='newList'></ul>"); for (cnt = 0; cnt < someList.length; cnt++) { $("#newList").append("<li>"+someList[cnt].FirstName + ":" + someList[cnt].LastName+"</li>"); } 

Since your HTML already has a DIV:

 <div id="myDiv"></div> 

Answer 2

Script:

 $(function(){ someList = [ {FirstName: "Joe", LastName: "Smith"} , {FirstName: "Will", LastName: "Brown"} ] $("#target").append("<ul id='list'></ul>"); $.each(someList, function(n, elem) { $("#list").append("<li>" + elem.FirstName + " : " + elem.LastName + "</li>"); }); }); 

and html:

 <div id="target" /> 

Answer 3

Hacky

 var list = "<ul>" for (cnt = 0; cnt < someList.length; cnt++) { list += "<li>" + someList[cnt].FirstName + ":" + someList[cnt].LastName + "</li>" } list += "</ul>"; 

It doesn't even bother creating dom objects correctly :)