Create a and fill it based on a passed array

by

First of all, don’t create HTML elements by string concatenation. Use DOM manipulation. It’s faster, cleaner, and less error-prone. This alone solves one of your problems. Then, just let it accept any array as an argument:

var options = [
        set0 = ['Option 1','Option 2'],
        set1 = ['First Option','Second Option','Third Option']
    ];

function makeUL(array) {
    // Create the list element:
    var list = document.createElement('ul');

    for (var i = 0; i < array.length; i++) {
        // Create the list item:
        var item = document.createElement('li');

        // Set its contents:
        item.appendChild(document.createTextNode(array[i]));

        // Add it to the list:
        list.appendChild(item);
    }

    // Finally, return the constructed list:
    return list;
}

// Add the contents of options[0] to #foo:
document.getElementById('foo').appendChild(makeUL(options[0]));

Here’s a demo. You might also want to note that set0 and set1 are leaking into the global scope; if you meant to create a sort of associative array, you should use an object:

var options = {
    set0: ['Option 1', 'Option 2'],
    set1: ['First Option', 'Second Option', 'Third Option']
};

And access them like so:

makeUL(options.set0);

More Related Contents:

  1. splice array from data
  2. Build tree array from flat array in javascript
  3. Converting JavaScript object with numeric keys into array
  4. Are Javascript arrays primitives? Strings? Objects?
  5. Finding matches between multiple JavaScript Arrays
  6. javascript filter array multiple conditions
  7. Parsing JSON objects for HTML table
  8. How does `Array.prototype.slice.call` work?
  9. How to transpose a javascript object into a key/value array
  10. Array.push() if does not exist?
  11. How to search in array of object in mongodb
  12. Merge duplicate objects in array of objects
  13. How to generate range of numbers from 0 to n in ES2015 only?
  14. Why is ‘for(var item in list)’ with arrays considered bad practice in JavaScript?
  15. To find Index of Multidimensional Array in Javascript
  16. Does .sort function change original array?
  17. How to convert hex string into a bytes array, and a bytes array in the hex string?
  18. Two arrays, where items in array x can be in array y but not vice versa, test all permutations
  19. How to loop through array in jQuery?
  20. How to find the indexes of all occurrences of an element in array?
  21. Javascript: Is the length method efficient?
  22. Filter nested array in object array by array of values
  23. Find last matching object in array of objects
  24. How to merge duplicates in an array of objects and sum a specific property? [duplicate]
  25. How are JavaScript arrays implemented?
  26. Converting Array of Objects into Array of Arrays
  27. Compare two Arrays with Objects and create new array with unmatched objects
  28. Difference between ( for… in ) and ( for… of ) statements?
  29. Find object having maximum value for the `id` property in an array of objects
  30. Why do these two javascript 2d-arrays behave differently?

Leave a Comment