I have 3 textarea elements on my page and there could be more than 3 in the future.
I want to get all the text from these textarea fields.
If I do $('textarea').val(); in chrome console, it only returns the first textarea's text.
How do I get the texts of all the elements in an array?
jQuery getters only return value of the first matched element, you should iterate through the collection, you can use .map() method which iterates through the collection behind the scene and returns a jQuery-wrapped array, by calling .get() method you can get the actual array.
var arr = $('textarea').map(function() {
return $.trim(this.value);
}).get();
As Pointy correctly mentions, for converting an array to a string you can use .join() method.
var str = arr.join();
.join() that result.
$('textarea') is an object containing all textarea elements in the DOM, but applying the .val() method directly to it only returns the value of the first element in the object. This is why you need to iterate over all the elements in the object, as can be done with the .map() or .each() methods.
(function () {
var arr = [];
$('textarea').each(function () {
arr.push(this.value);
});
} ());
