I have got a input field where in user enters data. There are 2 buttons next to it upon click any one of them or both the input fields get reset. Now since these buttons and field is not inside a form I can't go for a instead how can i clear it with JQuery. The point is, now I have displayed only 2 buttons, the JQuery must also work if there where more buttons..Fiddle link below and the code i tried

$('button').each(function(){
   $('button').click(function(){
      find('input[type="text"]').val() = "0";
   });
});

[Fiddle link] /

Thanks to all for help.

I have got a input field where in user enters data. There are 2 buttons next to it upon click any one of them or both the input fields get reset. Now since these buttons and field is not inside a form I can't go for a instead how can i clear it with JQuery. The point is, now I have displayed only 2 buttons, the JQuery must also work if there where more buttons..Fiddle link below and the code i tried

$('button').each(function(){
   $('button').click(function(){
      find('input[type="text"]').val() = "0";
   });
});

[Fiddle link] http://jsfiddle.net/vineetgnair/1s22gcL5/

Thanks to all for help.

• javascript
• jquery
• html

• The val() method gets or sets the value of the "selected" elements, to set it , add the new value as a parameter , so to reset the field call: val("") – EaziLuizi Commented Aug 26, 2014 at 9:23
• Hey Guys there is a bug i just figuered or may be I am wrong,but just to get cleared. On the same fiddle when you console log you will find one button click is equal to two buttons getting clicked. To prove my point here is the fiddle link jsfiddle.net/vineetgnair/1s22gcL5/12. Open up your consoles and see. Just clicking one button, the console shows 2 clicked...how can it be cleared.. – Vineet Commented Aug 26, 2014 at 9:42
• <input type="reset" /> – Punitha Subramani Commented Aug 26, 2014 at 9:45
• no no punitha.. i dont want to use <input type="reset" /> as I am not using forms here...i want to do it via JQuery – Vineet Commented Aug 26, 2014 at 9:48
• @VineetGNair..just remove $('button').each(function(){ line and see.. – Kartikeya Khosla Commented Aug 26, 2014 at 10:01

8 Answers 8

This will work:

$('button').click(function(){
   $('input[type="text"]').val(0);
});

If you want to just reset field then :

$('button').click(function(){
   $('input[type="text"]').val('');
});

No need of saying each, just say .click it will apply for every button

$('button').click(function(){
      $('input[type="text"]').val(0);
});

DEMO

Instead of javascript variable defining to jQuery.function = 0, you should just reset the value to clear the contents of the input field with .val('');

$('button').each(function(){
    $('button').click(function(){
        $('input[type="text"]').val('');
    });
});

This clean text field:

 $('button').click(function(){
        $('input[type="text"]').val("");
    });

This change value to 0:

 $('button').click(function(){
        $('input[type="text"]').val(0);
    });

Try this.

$('button').click(function(){
   $('input[type="text"]').val('');
});

Here'e the code:

$('button').click(function(){
   $('input[type="text"]').val('0');
});

That's it.

<input type="reset" value="button 2" />

You can use following code to clear your input field on button click.

$('button').each(function(){
    $(this).click(function(){
        $('input[type="text"]').val('');
    });
});