title: show javascript array values
body: <p>i'm new in JavaScript.<br/></p>
  
  <p>I have an array with some values and I'd like to show each array values within a list.</p>
  
  <h3>This is my script</h3>
  
  <pre><code>&lt;script&gt;
  var fruits = "apple,banana,watermelon,coconut";
  var plits = fruits.split(',');
  function a(){
    for(i=0; i&lt;plits.length; i++){
      document.getElementById('output').innerHTML = "&lt;li&gt;" + plits[i] + " fruit&lt;/li&gt;";
      //document.write("&lt;li&gt;" + plits[i] + " fruit&lt;/li&gt;");
    }
  }
  &lt;/script&gt;
  
  &lt;button onclick="a()"&gt;show fruits&lt;/button&gt;
  &lt;div id='output'&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Whenever i run the code, it only shows the latest value of the array.</p>
  
  <p>Likewise when i use the commented script above, the page changed and it turns infinity loading.</p>
  
  <p><P>How can i show the array values within the #output?</p></p>