• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 5837
  • Last Modified:

javascript change span color

I only know a span can be given an id. How can  its color be changed in javascript?
Thanks.
0
ksfok
Asked:
ksfok
  • 2
2 Solutions
 
b0lsc0ttCommented:
ksfok,

The background color can be changed with ...

document.getElemementById('theSpan').style.backgroundColor = 'red';

Let me know if you have any questions or need more information.

b0lsc0tt
0
 
gops1Commented:
Some different ways to change span color:
<html>
	<head>
		<title>Script Demo Gops&reg;</title>
		<style>
			body, input, div, a, span{font-family:verdana;font-size:11px;}
			span{cursor:hand;cursor:pointer;}
			#coCSS{background-color:#7CA6A6;}
		</style>
		<script language="javascript">
			function changeColor() {
				var o = document.getElementById('btnClick');
				o.style.backgroundColor='#9166E6';
			}
		</script>
	</head>
	<body>
		<span id="coCSS">I am a Span I am colored with CSS</span>
		<br><br><br>
		<span id="coClick" onclick="this.style.backgroundColor='#D5FF00'">I am a Span Click me to change color</span>
		<br><br><br>
		<span id="btnClick">I am a Span, change my color by clicking on [CHANGE COLOR] button</span>
		<input type="button" onclick="changeColor()" value="CHANGE COLOR">
	</body>
</html>

Open in new window

0
 
b0lsc0ttCommented:
I'm glad I could help.  Thanks for the grade, the points and the fun question.

bol
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now