CODEWITHSUNDEEP
javascripthtml
BeginnerAlibi
BeginnerAlibi

Reputation: 35

Random color function for multiple paragraphs

So this is function to color 5 paragraphs randomly into one color.

#js
function color(){

    bgColorCode = '#' + Math.floor((Math.random() * 999999) + 100000);

    for (var i = 0; i < arguments.length; i++) {
    document.querySelector('#'+arguments[i]).style.backgroundColor = 
bgColorCode;
    }
}

#html
<button onclick = "color('p1', 'p2', 'p3', 'p4', 'p5')">Color Paragraphs</button><br>
    <p id ="p1">
       random text
    </p>
    <p id = "p2">
       random text
    </p>
...

My question is now how to color 5 paragraphs randomly into diffrent color with only one button function?

Upvotes: 0

Views: 64

Answers (1)

Merijndk
Merijndk

Reputation: 1693

As gugateider suggests in his comment you can add the random color selection to your for loop, this way a new color will be generated for each graph:

function color(){

    for (var i = 0; i < arguments.length; i++) {
       bgColorCode = '#' + Math.floor((Math.random() * 999999) + 100000);
       document.querySelector('#'+arguments[i]).style.backgroundColor = bgColorCode;
    }
}

#html
<button onclick = "color('p1', 'p2', 'p3', 'p4', 'p5')">
   Color paragraphs 
</button><br>
<p id ="p1">
   random text
</p>
<p id = "p2">
   random text
</p>

Upvotes: 1

Related Questions