How to remove field from a specific form

Using jquery, i would like to remove a hidden input, based on a class name selector but I just want to remove this inside of one specific form?

something like this:

$('.addToCartButton').click(function () {

    var form = $(this).closest('form');

    //remove all inputs with class name "test" inside of the form object above.

});

What is the best way of doing this?

Update

As a follow up question, how can i

1. First rea开发者_开发知识库d each input val() into a variable before i remove it?

2. Get the first element from the find method (as it could return multiple elements)?

this should do it

$(form).find('input.test').remove();  //remove all elements

http://api.jquery.com/remove/

follow up:

var firstItem=$(form).find('input.test')[0]; // only the first item

var arr=[];  //this will build an array of the values
 $(form).find('input.test').each(function(){
    arr.push($(this).val());
  });

var arr=[];  //this will build an array of the names andvalues with a comma between
 $(form).find('input.test').each(function(){
    arr.push($(this).name + "," + $(this).val());
  });

loop through all values in array

for(var i=0;i<arr.length;i++){
    alert(arr[i]);
}

Try this

$('.addToCartButton').click(function () {

    var form = $(this).closest('form');
    var inputValues = {};

    //remove all inputs with class name "test" inside of the form object above.
    form.find("input.test").remove();

    //This loop will put all the input name/value pair into inputValues object
    form.find("input.test").each(function(){
       inputValue[$(this).attr("name")] = $(this).val();
    });

    //This will give you the first input element
    form.find("input.test:first");

});

 var form = $(this).closest('form');
form.remove('.class_name');