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
Nelson J
7,411 PointsWhy and how that works?
when I run:
var html = '';
var red;
var green;
var blue;
var rgbColor;
for(var i = 0; i < 4; i++) {
red = Math.floor(Math.random() * 256 );
green = Math.floor(Math.random() * 256 );
blue = Math.floor(Math.random() * 256 );
rgbColor = 'rgb(' + red + ',' + green + ',' + blue + ')';
html += '<div style="background-color:' + rgbColor + '"></div>';
document.write(html);
}
I get 10 divs with 10 random colors.
But when I change it to:
var html = '';
var red;
var green;
var blue;
var rgbColor;
for(var i = 0; i < 4; i++) {
red = Math.floor(Math.random() * 256 );
green = Math.floor(Math.random() * 256 );
blue = Math.floor(Math.random() * 256 );
rgbColor = 'rgb(' + red + ',' + green + ',' + blue + ')';
html += '<div style="background-color:' + rgbColor + '"></div>';
}
document.write(html);
It generates only 4, the expected.
Can somebody explain why? Thank you.
2 Answers
Steven Parker
231,236 PointsIn the second example, the loop builds up the "html" string, adding a new "div" in each iteration until it has 4 of them. Then when the loop ends the "document.write" outputs the string with the 4 divs in it.
But in the other example, the write is inside the loop, so every time the string is expanded it gets written. So when it has one div in it, that gets put on the page. Then when it has two in it, those two get put on the page following the one already written (total 3 so far). Then another one is added and those 3 are added to the others (total now 6). Finally the fourth one is added and they are all put to the page with the others, giving you a total of 10.
If you look closely, you should notice that the colors are not all random since some divs are put out multiple times. For example, the first, second, fourth and seventh will all be the same color.
Does it make sense now?
Steven Parker
231,236 PointsThank you! 
I would, however, be an unpaid intern or moderator if they wanted me to, it would make it easier to help folks here.
Nelson J
7,411 PointsMaybe shoot them an email. Check out this thread: https://teamtreehouse.com/community/how-to-be-a-moderator-of-treehouse also, can I ask how you learn to code ?
Steven Parker
231,236 PointsIt's not like they don't know who I am
I learn from a variety of sources. Treehouse is one of my favorites, but to supplement that (or for things not taught here) there are a few other online resources I like (Coursera and Lynda/LinkedIn Learning for example), plus sometimes I just dig through text training and reference guides from the software source (like MSDN for C# and the Python Software Foundation for Python) or a well-known reliable reference (like MDN for HTML/CSS/JavaScript).
Jorge Lopez
Python Development Techdegree Graduate 35,350 PointsYou're an incredible person.
"I just like helping people on these forums. My REAL job is helping people during disasters...."
Just wanted to say that.
Nelson J
7,411 PointsNelson J
7,411 PointsThank you that was driving me crazy. Do you work for teamtreehouse? if not, you should because you're always very helpful. cheer!