Question

Basically, I a trying to change the height of a textarea based on how many lines it has which is kind of irrelevant to the question, but here is the coding of adding event listeners to every textarea without using a for loop:

$('textarea').keyup(function(event) {
    this.style.height = Math.floor(this.scrollHeight / 11) + '.1em';
});

And here is my for loop:

for (i=0; i<$('textarea').length; i++) {
    $('textarea')[i].style.height = Math.floor($('textarea')[i].scrollHeight / 11) + '.1em';
}

The for loop works perfectly, but just for the sake of clean and efficient coding I would like for it to look more like the first coding without a for loop being needed.

Also, a note that all of this inside a if document is ready function.

Answer 1

you can try each() method:

$('textarea').each(function(){
     $(this).css('height', Math.floor(this.scrollHeight / 11) + '.1em')
})

jQuery.each()