Jquery Setting Value of Input Field

Question

I have an input field and i am trying to set its value using its class

<form:input path="userName" id="userName" title="Choose A Unique UserName" readonly="${userNameStatus}" class="formData"/> 

Which renders as:

<input id="userName" name="userName" title="Choose A Unique UserName" class="formData" type="text" value=""/> 

I am using the following jquery but this does not seem to work. Can someone tell me where i am going wrong.

$(".formData").html(""); 

Edited JQuery Function that handles the event

$('#reset').click(function (){             $("#userNameErr").text("");              $('#badgeNoErr').text("");              $(".errors").html("");              $(".formData").val("");          }); 

nor is $(".formData").text("") or $(".formData").val("") working.

Answer 1

This should work.

$(".formData").val("valuesgoeshere") 

For empty

$(".formData").val("") 

If this does not work, you should post a jsFiddle.

Demo:

$(function() {    $(".resetInput").on("click", function() {      $(".formData").val("");    });  })

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>  <input type="text" class="formData" value="yoyoyo">      <button class="resetInput">Click Here to reset</button>

Answer 2

If the input field has a class name formData use this : $(".formData").val("data")

If the input field has an id attribute name formData use this : $("#formData").val("data")

If the input name is given use this : $("input[name='formData']").val("data")

You can also mention the type. Then it will refer to all the inputs of that type and the given class name: $("input[type='text'].formData").val("data")