By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,654 Members | 1,513 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,654 IT Pros & Developers. It's quick & easy.

Change class attribute onclick

P: 3
I am trying to create a javascript that will change the color of text for the label of a form field on a the click of a button. I have come up with something, but it doesn't seem to work. Any suggestion?

[HTML]<html>
<head>

<style type="text/css">
.my_red { color: #ff0000 }
.my_green { color: #00ff00 }
.my_blue { color: #0000ff }
.my_black { color: #000000 }
</style>


<script language="JavaScript">

function change_color()
{
function change_fname()
{
var v_obj;
var v_attribute_list;
var v_class;
v_obj=document.getElementById('id_fname');
v_attribute_list=v_obj.attributes;
v_class=v_attribute_list.getNamedItem("class");
v_class.value="my_red"
};
change_fname();
function change_ssn()
{
var v_obj;
var v_attribute_list;
var v_class;
v_obj=document.getElementById('id_ssn').class="my_ green";
v_attribute_list=v_obj.attributes;
v_class=v_attribute_list.getNamedItem("class");
v_class.value="my_green"
};
change_ssn();
function change_phone()
{
var v_obj;
var v_attribute_list;
var v_class;
v_obj=document.getElementById('id_phone');
v_attribute_list=v_obj.attributes;
v_class=v_attribute_list.getNamedItem("class");
v_class.value="my_blue"
};
change_phone();
}

</script>
</head>

<body>

<div id="id_form"
<div id="id_fname" class="my_black">First name</div>
<input name="name" type="text" size="25"/>
<div id="id_ssn" class="my_black">SSN</div>
<input name="SSN" type="text" size="9"/>
<div id="id_phone" class="my_black">Phone</div>
<input name="Phone" type="text" size="9"/>
<hr>
<input type="button" onclick="change_color()">

</div>

</body>

</html>[/HTML]
Oct 25 '07 #1
Share this Question
Share on Google+
2 Replies


P: 31
why dont you try something like:

Expand|Select|Wrap|Line Numbers
  1. document.getElementById('id_phone').className = "my_red"
?
Oct 25 '07 #2

P: 3
Thanks for your help!
Oct 25 '07 #3

Post your reply

Sign in to post your reply or Sign up for a free account.