AddAttr not working in jquery?

Question

I have an example code:

<input type="text" name="color" id="color" value="" /> 

And jquery

 $('#color').change(function(){ $('#color').addAttr('value', 'test'); }); 

When I change the value in the text field, the result is value="" and an error in firebug $("#color").addAttr is not a function

How to fix it?

Answer 1

It is called .attr() , not .addAttr() .

You should also replace your inner $('#color') with $(this) to indicate that you are controlling the same input that changes:

 $('#color').change(function(){ $(this).attr('value', 'test'); }); 

Answer 2

You are not sure that removeAttr() and you think addAttr() exists, which is wrong.

I believe you need the .attr() function - currently .prop() .

Answer 3

You can also do:

 $('#color').change(function(){ $(this).val('test'); });