Retrieving values from multiple text inputs in jquery

Question

I have multiple text boxes and textareas of which I want to add the values to an array.

With the way I am doing it at the moment I do manage to get the values of the text boxes but not the text areas.

How can I retrieve the values of multiple textarea?

<input type="text" name="fields[]"
<input type="text" name="fields[]"
<input type="text" name="fields[]"

<textarea name="areas[]"
<textarea name="areas[]"
<textarea name="areas[]"

This is the Jquery with which I do this.

var fields = [];
$('input[name^=fields]').each(function () {
    fields.push($(this).val());
});
var areas = [];
$('input[name^=areas]').each(function () {
    areas.push($(this).val());
});

I do manage to get the text box values but not the Multiline values(text area)

How can I do this?

Answer 1

But the best practice would be providing a class name for textarea and accessing values as follows :

<textarea class="areas"></textarea>
<textarea class="areas"></textarea>
<textarea class="areas"></textarea>


   var areas = new Array();
   $('.areas').each(function () {
         areas.push($(this).val());
   }); 

Check this : http://jsfiddle.net/Q9tm6/17/

Answer 2

Well obviously textarea's are not <input>. You should try something like:

var areas = [];
$('textarea[name^=areas]').each(function () {
    areas.push($(this).val());
});