Changing the style of all html elements of a certain type via scripting

**hall** · Apr 26th, 2001, 01:33 PM

Help! How do you change the style of all the HTML elements of a certain type via script??? For example, if I wanted all paragraph elements in a document to have blue writing I just add the following to the HTML

<style>
p {color:blue}
</style>

Now, how would I do that with script such that if a user clicked on something, a function would fire that would change all the paragraphs or any other element type of interest blue. I know how to do it for a single element, just not all the elements of a certain type. For example, the following would turn the p1 paragraph blue.

<script>
function turnblue()
{

p1.style.color=”blue”

}
</script>

<html>
<p id=main onclick=”turnblue()”>click here to turn p1 paragraph blue

<p id=p1> paragraph p1
<p id=p2> paragraph p2
<p id=p3> paragraph p3
<p id=p4> paragraph p4
<p id=p5> paragraph p5
<p id=p6> paragraph p6
<p id=p7> paragraph p7
<p id=p8> paragraph p8

</html>

Now, how would I change all paragraphs blue in the function. Thanks very much in advance.
KBH

**sebs** · Apr 26th, 2001, 02:21 PM

eval function

Code:

<script> 
function turnblue() 
{ 
for(x=1;x<9;x++){
eval("p" + x + ".style.color=blue"); 
}
} 
</script>

try this buuuuuudy!!

**hall** · Apr 26th, 2001, 03:11 PM

Thanks very much Sebs, but what if my paragraph were not so nicely named such that you couldn't use a for loop, i.e.

<p id=intro_para> paragraph p1
<p id=first_para> paragraph p2
<p id=second_para> paragraph p3
<p id=third_para> paragraph p4
<p id=conclusion_para> paragraph p5
etc. etc.

Thanks,
KBH

**sebs** · Apr 27th, 2001, 07:02 AM

then...
put all your paragraph name in an array and loop thru the array!

<script>
function turnblue()
{
for(x=1;x<9;x++){
eval(paragraphArray[x] + ".style.color=blue");
}
}
</script>

Thread: Changing the style of all html elements of a certain type via scripting

Thread Tools

Display

Changing the style of all html elements of a certain type via scripting

Thanks Sebs, but .......

Posting Permissions