jquery function to empty some elements in a form

Question

Hi everybody,

I have a page with a form, I'd like with a button have reset button effect only on input text inside a div here is an extraxt of my code:

html:

<div id="new_prom" style="clear:both; padding:2px; border:1px solid red; margin:5px;">
<div>
  Codice <input type="text" id="cod_pro" name="cod_pro" class="short"> Sottocodice <input type="text" id="sotto_pro" name="sotto_pro" class="short"><br>
Nominativo<br>
<input type="text" id="nom_pro" name="nom_pro" class="long">
</div>
<div>
<div class="bt" id="bt_pro">INSERISCI</div> <div class="bt" id="resetta">RESET</div>
</div>

jquery:

$("#resetta").live('click', function()
{
   $("#new_prom > text").each(function(){$(this).val("")});
});

thanks in advance.

ciao, h.

Answer 1

You almost have it correct, the selector is [type='text'] or :text, like this:

$("#resetta").live('click', function() {
  $("#new_prom :text").val("");
});

You can give it a try here, the other part is the .val(""), it'll work on all matched elements when setting, no need to loop in a .each().

Answer 2

Think you forgot the colon.

$("#resetta").live('click', function() 
{ 
   $("#new_prom :text").each(function(){$(this).val("")}); 
});