Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Loops, Arrays and Objects Tracking Multiple Items with Arrays Using For Loops with Arrays

Alex Franklin
Alex Franklin
12,403 Points

Using For Loops with Arrays - My list is printing inline without format like in the video... Please Help!

Everything is working as it should, except that my list is printing as one long, inline, comma-separated list, rather than in an ordered list with formatting like shown in the video.

My list looks like this:

"Invisible Man,Into the Wild,Finding Alaska,Drop City,On The Road,Lord of the Flies"

I'm in Chrome and moved everything to Codepen. I copied and pasted the exact CSS from the Workspace and made sure my HTML was almost exactly the same, but I've included it below just in case.

1) This is a link to the project file I'm working with in Codepen:

https://codepen.io/alex-franklin/project/live/XWxdwg

2) My JavaScript:

var bookList = [ "Invisible Man", "Into the Wild", "Finding Alaska", "Drop City", "On The Road", "Lord of the Flies" ]; var html = ''

function print(message) { document.write(message); }

function printList( list ) { var listHTML = "<ol>"; for ( var i = 0; i < list.length; i += 1 ) { listHTML += "<li>" + list[i] + "</li>"; } listHTML += "</ol>"; print(listHTML); }

print(bookList);

3) My HTML

var bookList = [ "Invisible Man", "Into the Wild", "Finding Alaska", "Drop City", "On The Road", "Lord of the Flies" ]; var html = ''

function print(message) { document.write(message); }

function printList( list ) { var listHTML = "<ol>"; for ( var i = 0; i < list.length; i += 1 ) { listHTML += "<li>" + list[i] + "</li>"; } listHTML += "</ol>"; print(listHTML); }

print(bookList);

1 Answer

Jesus Mendoza
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Jesus Mendoza
Full Stack JavaScript Techdegree Graduate 20,337 Points

Hi alex,

Your code is being displayed this way because you passed your bookList array to the print() function. This will only display the array alone. You need to pass bookList to your new function printList() instead. This will turn your array into an ordered list. It's the small mistakes that get us!

printList(bookList);