title: Refresh the content of a list in a way that you are not adding new li but replacing with new?
body: <p>Is there a way to refresh the content of a list in a way that you are not adding new li but replacing with new?</p>
  
  <p>At the moment I am trying to print from an array that has some objects with one of the property being an array itself. So each time you get randomly an object you will print it's array as well. So far I am creating list items where the items of array can be printed but each time it's adding rather than having new list item.</p>
  
  <p>To be clear I want to see only the current object property inside the list not the previous. So once the new object is picked the list to be updated with the new content...</p>
  
  <p>Is there a different way? I tried to change the inner html of the container div with a new list but it doesn't work....</p>
  
  <p>This is what I am using but it just adds to the list rather than replacing...</p>
  
  <pre><code>var ul = document.createElement('ul');
  var li = document.createElement('li');
  li.appendChild(document.createTextNode(quotesTags[i]));
  ul.appendChild(li);
  div.appendChild(ul);
  </code></pre>
  
  <p>Thank you,
  Alina</p>