Displaying List Of JavaScript Objects As HTML List Items

Question

When I attempt this, the HMTL page only displays the last object, instead of all the objects.

Here is my JavaScript file

var family = {
  aaron: {
    n         


        

Answer 1

Remove elList because there is no point in having it...

Then change

document.getElementById('aaron-family').innerHTML = prop;

To

document.getElementById('aaron-family').innerHTML += prop;

That way you are not constantly setting the innherHTML to prop. Also, you might find it better to change the function to the following in order to prevent from constantly getting the element.

function list(family) {
  var elList = document.getElementById('aaron-family');
  for (var prop in family) {
    elList.innerHTML += prop;
  }
}

---

Hope this helps:)