What is happening in this challenge? I am completely lost!

how come we have 10 divs on the page and none in the html code?

you are placing the div tags from the javascript file. likely there is a piece of code like

document.getElementByID("IDNameHere").innerHTML = html;

this code looks at the document, finds an ID with a specific name and, .innerHTML is used here to place the html file into this given location.

why did we multiply Math.random by 256? Colors are made up of RGB values that range from 0 to 255 so RGB values of 0,0,0 would be black up to 255, 255, 255 would be white

what's the meaning of these two lines of code?

  rgbColor = 'rgb(' + red + ',' + green + ',' + blue + ')';
  html += '<div style="background-color:' + rgbColor + '"></div>';

Here you are creating RGB colors. Think of it as creating the actual CSS of an RGB color. The format for that would be

rgb(num1, num2, num3);

so the first line is setting the variable rgbColor to 'rgb(red, green, blue) the second line is adding to the variable html a div tag that has style set to a specific rgbColor that was just created in the first tag This means that the variable html is getting a div tag that has css styled to it within the div tag. when done, html will hold a total of ten div tags that will then be put onto the screen.

how can we get colors by mixing numbers?

explained above

what is happening after the counter is no longer equal to 10?

the variable html is being sent to the index.html file using the code from above.

document.getElementByID("IDNameHere").innerHTML = html;

Please note, i have not watched the video again so this is just how things should be working based on the limited info provided.

Arikaturika Tumojenko

If you look at the code, the html variable can be thought of as a collector in memory as the divs are being created for the different colours. When you console log the html variable, you see that it is a long string with all of the divs next to one another. This is then put out to the browser with the document.write method (after you are out of the loop....kind of after the collection is done)

We are creating the rgbColor variable to have a different colour each time by altering the r (red), g(green), b(blue) values with the help of the loop. And each time that is done we are writing it into a div that we are storing into the html variable.

Great explanations above by everyone. I hope this helps as well.

Regards.

Yes, actually the code is (or at least mine, since Guil used a for loop):

       var html = '';
      var red;
      var green;
      var blue;
     var rgbColor;

    var counter = 0;

     while (counter <10) {

                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>';

               counter +=1;
                       }


                             document.write(html);

So we didn't use this code:

     document.getElementByID("IDNameHere").innerHTML = html;

You explanation made thing a bit clearer, but I still have the feeling the examples used in this challenges are a bit over out head and sometimes use things we didn't cover yet. Sight.

I have one more question. When exactly do we create the div? When this code runs?

 html += '<div style="background-color:' + rgbColor + '"></div>';

So we actually generate a div which is already styled and we keep adding one until the loops runs 10 times, after the code exits the loop and we see the whole 10 divs at once?

Oh..In your code you have used the random method to create the RGB values. So you are just using the loop to create a certain number of divs (ie dots of colour)