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 trialNikita Tsigelberg
2,625 PointsGetting weird output in browser
Why am i getting i inside the white circles instead of numbers 1 to 10. i copied the code same exact way.
4 Answers
Steven Parker
231,269 PointsAlways show your code with a question. But I'd guess you may have left off the ${} symbols, which would make it output the variable name instead of the number it represents.
If that's not it, show your actual code to allow for a more accurate answer.
Daniela Fernandes Smith
Courses Plus Student 10,353 PointsJelena, to get the cleanest code, and to make sure it's easier for you to read it in the future, you could write it like this (this is something that adds to the lessons used in this video, but it's how I did it and it works perfectly fine). It uses concepts that are taught in the course DOM scripting by example, here at Tree House:
const main = document.querySelector('main');
for(let i = 1; i <=10; i++) { let div = document.createElement("div"); div.innerHTML = i; main.appendChild(div); }
If you prefer not to use the concepts not taught in this class, you can use instead:
const main = document.querySelector("main"); let html = "";
for(let i = 1; i <= 10; i++) {
html += <div>${i}</div>
;
}
main,innerHTML = html
Make sure you use <= in the loop, not <, if you want the numbers to display properly, from 1 to 10, and initiate your let i at 1, not 0.
Jelena Feliciano
Full Stack JavaScript Techdegree Student 12,729 PointsThe way the video appears to give us a result on the browser 1 -9 const main = document.querySelector('main'); let html = '';
for( let i = 1; i < 10; i++) {
html += <div>${i}</div>
;
}
main.innerHTML = html;
const main = document.querySelector('main'); let html = '';
This code worked better for getting the 1-10 result:
for( let i = 0; i < 10; i++) {
html += <div>${i + 1}</div>
;
}
main.innerHTML = html;
I also found this code to work:
const main = document.querySelector('main'); let html = '';
for( let i = 1; i < 11; i++) {
html += <div>${i}</div>
;
}
main.innerHTML = html;
Daniela Fernandes Smith
Courses Plus Student 10,353 PointsNikita, you probably forgot to use the ${} to wrap the let i inside your for loop. it should be like this:
hmtl += <div>${i}</div>
;
you probably wrote it like this, instead:
html += <div>i</div>
Jelena Feliciano
Full Stack JavaScript Techdegree Student 12,729 PointsJelena Feliciano
Full Stack JavaScript Techdegree Student 12,729 Pointsconst main = document.querySelector('main'); let html = '';
for( let i = 1; i < 11; i++) { html +=
<div>${i}</div>
; }main.innerHTML = html;
I entered mine like this and got the browser to read 1-10 for some reason the way the video shows it I got 1-9 instead.