How can I change the color in my array using javascript still using innerHTML

JavaScript
#1

It is possible to change the color of my array using javascript still using document.getElementById("myArray").innerHTML = girls; ???
JS

function myArray() {
		var girls = ["barbara", "gloria", "andrea"];
		myArray.toString();
		document.getElementById("myArray").innerHTML = girls;
		document.getElementById("myArray").style.color = red;

	}
#2

The line above is not doing anything for you.

Unless you have a variable named red with a string value of “red”, the line above is not going to do what you hope.

Do you have an existing element in your HTML with an id=“myArray”?

It would help if you posted a link to your code using Codepen.io, jsFiddle.net or similar site. Then we can see your full code and any changes you make to it.

#3

code
i would like to change the font color to red when the array appears using the this line of code document.getElementById("myWishes").innerHTML = wishes;
i was trying to do it in this way:

unction myWishes() {
		var wishes = ["soda", "pasta", "tv", "pizza"];
		myWishes.toString();
		document.getElementById("myWishes").innerHTML = wishes;
		document.getElementById("myWishes").style.color = red;
	}

but didnt work

#4

The code above suffers from the exact same problems I mentioned above. You need to post your HTML also.

#5

This is my code in codepen

#6

red is not a variable you have defined anywhere. You could assign the string value “red” and that would change the font color to red.

Also, myWishes.toString(); is not doing anything so you can delete it.

#7

OMG thats easy, so can we use continuously different

document.getElementById("myWishes").innerHTML = wishes;
document.getElementById("myWishes").style.color = "red";
document.getElementById("myWishes").style.background= "blue";

to modify the elements without issues right?

#8

Yes, but if you are going to use common styling on elements, it would be better to create a class selector in CSS add the class to the element. If you have predefined elements in your HTML, you could do the following instead:

HTML

<p>Be careful with what you wish my friend</p>
<p id="myWishes" class="wishes"></p>
<button onclick="myWishes()">Show me my wishes</button>

CSS

.wishes {
  color: red;
  background:blue;
}

JS

function myWishes() {
  var wishes = ["soda", "pasta", "tv", "pizza"];
  document.getElementById("myWishes").innerHTML = wishes;
}
#9

thanks alot that info was handy thanks :grinning::grinning:

#10