Example

by aarkuo17

HTML

<!-- Learn about this code on MDN: https://developer.mozilla.org/en-US/docs/Web/API/Document/createDocumentFragment -->

<ul id="ul">
</ul>

JavaScript

/* var element  = document.getElementById('ul'); // assuming ul exists
var fragment = document.createDocumentFragment();
var browsers = ['Firefox', 'Chrome', 'Opera', 
    'Safari', 'Internet Explorer'];

browsers.forEach(function(browser) {
    var li = document.createElement('li');
    li.textContent = browser;
    fragment.appendChild(li);
});

element.appendChild(fragment); */

var fragment = document.createDocumentFragment();
var options = ['A', 'B', 'C', 'D', 'E'];

options.forEach(function(option){

	var li = document.createElement('li');
  li.textContent = option;
  li.className = "Aaronli"
  fragment.appendChild(li);

});


var ul = document.getElementById('ul');
ul.appendChild(fragment);