Tracking Forums, Newsgroups, Maling Lists
Home Scripts Tutorials Tracker Forums
  Advanced Search
  HOME    TRACKER    JavaScript


Change Button Color With Onclick Function?

I want to change the color of a button when it is clicked and have added this getElementById line in the function called by onclick but when I add the line the function won't run. The function also contains AJAX to change the button content but everything else is working fine as long as I don't add this line.

<input type = "button" id = "alternative1" value="$alt1" onClick="changeQuestion('alternative1')">
function changeQuestion(answer)


View 4 Replies (Posted: Aug 22, 2011)

Sponsored Links:

Related Forum Messages For JavaScript category:
Function Called OnClick To Change Button Text
I need a javascript function to be called on certain button click, upon that click the button name will change. i.e.,
<input type=button id = button1 value=boy onclick=function(boy,girl)>
I need the javascript function to take 2 parameters and check if the value of the button is the first paramter, then the value will become the 2nd and vice versa. So if I press the button and it says BOY, it will become Girl and if i press the button and it says Girl it will become boy!

Posted: Sep 21 11 at 10:33

View 5 Replies!   View Related
JQuery :: AddClass - Change The Color Of Surrounding Text Of The Disabled Radio Button To The Color Grey
I have this markup:


There are two radio buttons, sometimes one will be disabled, other times the other will be disabled. I would like to make a script that: First: Changes the color of surrounding text of the disabled radio button to the color grey. Second: Checks the other radio button.

This was my plan: I would make a script that: First: Removes all the current classes and add the class "greyed_out" (or better: change only the color of) the parent element, all siblings and children of siblings (if any) of the radio button that is disabled at that time.Second: Sets the attribute "checked to the other radio button". I made a script, but when I set the bottom radio button to disabled the script doesn't work:


Posted: 08-Feb-2010

View 4 Replies!   View Related
Onclick Link Change Text Color ?
I have a page here [url]. What I want to control is that for link on the left that is clicked I want the text to change to a particular color to highlighted it have been selected. And when another linked is clicked I want the previous linked to be reset to the normal color. How to achieve that.

Posted: Aug 11th, 2011

View 2 Replies!   View Related
Onclick Link Change Text Color
I have a page here [url]. What I want to control is that for link on the left that is clicked I want the text to change to a particular color to highlighted it have been selected. And when another linked is clicked I want the previous linked to be reset to the normal color.

Posted: Aug 11, 2011

View 4 Replies!   View Related
Change Color Onclick For Default Textbox Value?
I've been trying to make a default value in a text box go away when clicked.

The general consensus on this forum and on the rest of the internet seems to be that this code:

function clearText(field){
if (field.defaultValue == field.value) field.value = ''
else if (field.value == '') field.value = field.defaultValue;


But I wonder how I can add a color change to this function. They default value "enter email address here" would be in grey, but when the user begins to type, it would be black. then deleted what'd been typed, back to grey.

document.getElementById(email_box).style.color='#000000'; that too nave..? It didn't work no matter where I put it. And dreamweaver didn't like it when I tried to copy the syntax of the first function, but make it change colors instead. It furthermore hated me trying to assign two different functions to the onClick event.

It also didn't like at all when I tried to apply two classes to the same object..

Posted: 01-11-2011, 08:25 PM

View 3 Replies!   View Related
Query :: Onclick Change Background Color?
I have following UL - LI html.

<LI><span id='select1'>Text</span></LI>
<LI><span id='select2'>Text</span></LI>
<LI><span id='select3'>Text</span></LI>
<LI><span id='select4'>Text</span></LI>
<LI><span id='select5'>Text</span></LI>
<LI><span id='select6'>Text</span></LI>

If I click on specific <span>, its background color should be changed. i.e. if I click on span having id='select3', its background-color should be changed. How this can be done using jQuery?

Posted: Feb 24 11 at 10:59

View 4 Replies!   View Related
Change The Background-color Of The Link Onclick?
l have got a series of menus. What l want to do is change the background-color of the link onclick.

What l have done use jquery like this

jQuery('.menu a').click(function(){
var clz = jQuery(this).attr('id');

This is not work.The code needs to work on mobile phones

Posted: Oct 11th, 2011

View 3 Replies!   View Related
Change Text Color Of A Link With Onclick Event
I created 3 hyperlinks, when the user click each link, it will change
the color of the text of a link. For example, when user clicks Link1,
text Link1 will become red color, but Link2 and Link3 unchange. Here's
my attempts, any ideas??

<script language="javascript">
function changecolor (i)
document.i.fontcolor = red;
</script></head><a name="item1" href="test.html"
onClick='changecolor(item1)'>Link 1</a><a name="item2"
href="test.html" onclick='changecolor(item2)'>Link 2</a><a
name="item3" href="test.html" onclick='changecolor(item3)'>Link 3</a>

Posted: July 20th, 2005

View 5 Replies!   View Related
JQuery :: OnClick, Change Background Color For Table Cells?
Let me show you a demo: hereit is working for only rows. its not working for cells. i want to change cells' (tds') background colors with mouse clicks.For example: a have a table, and it has 4 tds. table's background color is white. if i click to a td, a td should be red, than if i click to b, b td should be red and a td should be white again. if i click to c than, c should be red and b should be white right now

Posted: Dec 28 10 at 1:33

View 4 Replies!   View Related
Changing Text Color Onclick And Change Back For Other Items?
I found this in another question/answer and modified it... but it still doesn't work.

document.getElementById('change').onclick = changeColor;
function changeColor() { = "red";


My issue is: When I run this, both should have black color. When I click on the first, ONLY THAT one should turn red. If after that I click on the second one, the first one should be black again and only the second one red..

Posted: Nov 15 11 at 23:22

View 2 Replies!   View Related
Change A Color Of A Button When Button Is Selected?
I have a grid of buttons where if the user clicks on a button, the value of the button goes into the readonly textbox. What I want which I can't get working is that I want the selected button from the grid to turn green and all the other unselected buttons to stay the same color as it is. The reason for this is that if the user opens up the grid at any time, they can see the button that is currently selected by the change of color on the button. If another button is selected then the previous selected button would turn white and the new selected button would turn green.

my current code is in jsfiddle. click here

Posted: Dec 9 11 at 14:33

View 3 Replies!   View Related
Change Button Color Under Certain Condition
I'm facing a problem to change the button from invisible to white color under if condition. I just manage to make it disable.

Posted: 03-20-2011, 09:09 PM

View 3 Replies!   View Related
Button To Change Header Font Color?
This is the site I'm working on: http:URL]

On the right hand side you'll see a module called Tinker. Basically its a set javascript button that will change either the background color or the font color of the site. I'm trying to add a button that changes the header font color

Here is the code for the Javascript method.

function changeBG(num){ = "";
document.bgColor = color[num];


Posted: 14 January 2011

View 7 Replies!   View Related
Change Button Background-color On Clicking Itself?
Let's say I have #button with a given background-image:url(images/some_background) and I want to change it to another background when I click it, let's say url(images/other_background).

<a id="button" ></a>
display: block;


Posted: Jul 12 11 at 2:37

View 3 Replies!   View Related
JQuery :: Display Primary Button In Orange Color And Secondary Button In Grey Color
I am using jQuery button in my project, I need to display primary button in orange color and secondary button in grey color; but for me both buttons are in the same color grey.

I am using following code:

Posted: Oct 23 10 at 20:41

View 2 Replies!   View Related
Button Colors Flipfloping - Change From One Color To Another When Click Them And Change Back When Click Them A Third Time
I'm trying to make buttons that change from one color to another when you click them and change back when you click them a third time. I wrote this page ( but it only works on Firefox(Not IE or Chome, untested on safari or Opera). I'm using javascript to change the button colors. Is there another way to do this that works universal or another tool such as CSS?


Posted: 02-12-2010, 06:12 AM

View 1 Replies!   View Related
Change Button Background Color On Click In Mobile Web App?
In our mobile web app, we have some input buttons with default background color set to Red. Now on touch of the button, we want to change the color to Blue to show some activity. The button should remain in active background color as long as the intended onclick function of the button is finished. Once the onclick function is finished, the background color is changed back to default Red.

I tried couple of solutions to implement above behavior. But none of it works as expected.

1) Since there is no onmouseover event in mobile browsers (iphone & android), I use onclick event to change the button color.

<input type="button" id="validate" class="redButton" value="Validate" onclick="handleOnClick(this);"/>;
function handleOnClick() {


Ideally, when user clicks on button, handleOnClick() function is called and first button background color should change to Blue, then it should call doSomething() and finally it should change color back to Red. In reality, doSomething() is executed so quickly that button color change is not visible to user and it remains red. Before browser can change the class and apply new CSS styles of changeColor('blue'), it calls changeColor('red').

2) I tried "ontouchstart" event to change the background color. But problem with this approach is that once you touch the button and then move the finger away from the button, it still fires ontouchstart but not onclick event.

Is there any other way I can change the color of the button for mobile browsers?

Posted: Nov 29 11 at 22:06

View 1 Replies!   View Related
Background Color Of Table Change With Radio Button
I'm trying to create a cell in a table which changes color depending which radio button is checked.

I found the following code which works for different cells but it doesn't work when the buttons are in the same cell. Think you'll see what i mean. I'm not too hot when it comes to Javascript though so i don't know how to adapt what I've got so far. Code:

Posted: 03-27-2006, 05:35 PM

View 3 Replies!   View Related
Jquery :: Animate Link Color Change From Current Color To Other Color
I'm trying to animate a link color change from the current color to an other color.For some reason it's not working. I'm using the jQuery color plugin.

Posted: Aug 6 11 at 13:41

View 1 Replies!   View Related
Change The Onclick Of A Button?
I want to click a button called 'view report' and then depending on a value of a text field on the page the form will be directed to different php pages.

<input name="viewreport" type="submit" value="View report"onclick="workOutWhichReport()" />


I think the problem is that because the javascript has to be outside the form to read the text field value it can't execute on the form properly

Posted: 04-14-2010, 11:42 AM

View 1 Replies!   View Related
How To Change Button Value OnClick
How do I change the Button's value onClick?I want it to initially be "Read More" and then change to "Show Less"

<script type="text/javascript">
function toggleMe(a){
var e=document.getElementById(a);


Posted: 04-22-2011, 08:54 AM

View 4 Replies!   View Related
How To Change Button Text OnClick MVC
I have a toggle button, with a show/hide feature in javascript. How do I change the text when the button is clicked?
<button id="ShowHide">Show</button>

Posted: Feb 18 10 at 14:41

View 5 Replies!   View Related
Radio Button Onclick Change Url?
I have a radiobutton set of 2 radiobuttons... I want to be able to change url if the radiobuttons are checked. How do I go about that.I have figured out that I need to use the onClick handler, but cant firgure out how to change the url..

Posted: Nov 20, 2009

View 2 Replies!   View Related
Change OnClick Value Of A Button To Another Value Using Select?
I am a little lost at this point in my project. I work for a company that provides translation services. Well, I am making a simple calculator to calculate the cost of a translation based on the number of words in the entire project. It also changes rate based on the amount of words entered. I have that part done. I wrote this and it works:

function wordcountprice(){
var price, final,


Posted: Mar 10 11 at 0:35

View 2 Replies!   View Related
Copyright 2005-08, All rights reserved