How can i make a button to clear one of my fields in a form?

Question

I don't want to clear the entire form just the Reference input boxes as shown below.

 <tr>
           <td>Reference *</td>
           <td>
              <!--<input type='Text' name='reference_ABC' size='3' maxlength='3' style='width:75px;font-family:Century Gothic'>-->
              <input type='number' id='a' name='reference_end' required size='7' maxlength='1'  style='width:90px;font-family:Century Gothic; text-transform:uppercase; '>
              <input type='Text' id='b'  name='reference_end' required size='7' maxlength='3'  style='width:140px;font-family:Century Gothic; text-transform:uppercase;'>
              <input type='number' id='c'  name='reference_end' required size='7' maxlength='6'  style='width:190px;font-family:Century Gothic; text-transform:uppercase;'>
           </td>
        </tr>

Answer 1

You can use it like this:

<button id="resetButton">Reset</button>

<script type="text/css">
    $('#resetButton').click(function() {
       $("[name='reference_end']").val("");
    });
</script>

Answer 2

您可以使用

$("[name='reference_end']").val("");

Answer 3

       <button class="reset">Reset the input</button>

   <script>
   $('button.reset').click(
        function(){
            $("[name='reference_end']").val("");

        });
   </script>