html - javascript foreach array and split by comma and space and display as a string -

i have long list of items in list item, need go through , add comma , space , display comma seperated string of items:

so have following:

 <ul>     <li>item 1</li>     <li>item 2</li>     <li>item 3</li>     <li>item 4</li>     <li>etc</li>  </ul> 

which need display following:

item 1, item 2, item 3, item 4, etc

 <p>item 1, item 2, item 3, item 4, etc</p>  

i new javascript great.

thank

using unique id's in code makes work simpler.

<ul id="myul">     <li>item 1</li>     <li>item 2</li>     <li>item 3</li>     <li>item 4</li>     <li>etc</li>  </ul> <p id="mypara"></p> 

the javascript this

//grab ul element id , li tags within it. var myarr = document.getelementbyid("myul").getelementsbytagname("li"); //grab paragraph wish populate var para = document.getelementbyid("mypara"); //specify output array var output = [];  //loop on li's , grab html content for(var i=0; i<myarr.length; i++){     output.push(myarr[i].innerhtml); }  //set paragraph value joining outputs  para.innerhtml = output.join(", "); 

here working jsfiddle - http://jsfiddle.net/gbdtm/

some useful references

• html id's
• document.getelementbyid
• .getelementsbytagname
• for loops
• arrays
• .join()