Having them all green is a little bit boring, so let's add in some color into those elements as we're
generating them and we can update those colors here so we can call it random color and invoke a function
called random color.
And then down here, let's create that function.
So this is our function, a random color.
And what we're going to be doing is we're going to be returning back.
So it's going to be a hex value and we need to generate several.
Hex color values, so these are essentially numbers from zero to two fifty five, so setting up a function
in order to do that so that we can call to this function.
So let's create our hex using math.
Floor seats are going to generate a random number from zero to 255.
Then we're going to convert it to string and convert it to a hex value.
We can return back that Hecks here and we can try this one out.
So now when we go over and we refresh, can see that's generating these colors.
And sometimes there are some issues.
So if we do an inspect on this, you can see that it generated a color on it.
Let me get this a little bit bigger.
You can see that it generated a color, but there was a problem there because it didn't generate a proper
color.
And that's because sometimes when you generate things randomly and you need two characters, you need
to make sure that you are getting those two characters.
So the way to do that is to take our value of hex and we're going to update it.
So we're going to add a zero to the front of it.
So we're going to add whatever the value of it is and convert it, make sure that hex is a string value.
So adding a zero to it and then using JavaScript substring, which returns a specific number of characters
from the beginning of a location or from the end of the location.
So in this case, we're doing the end of the location.
So now Hex will always be at least two characters long.
So we don't we don't run into those issues anymore.
And as you can see now, we're generating all kinds of nice, colorful elements as we click.
So we don't have that problem anymore.
So now go ahead and add this into your project, add the ability to generate colors and random colors
of those elements.
And coming up next, create a garbage area here.
So in case we've created something we want to get rid of, them will create an element that we can essentially
act as a garbage pail where we can dump these elements.
So whenever these elements are on top of that, they're going to simply disappear off the screen and
we can remove those elements.
So that is yet to come in the next lesson.
So go ahead and add in the colors.