How to count lines within an element and set a maximum?

Question

I'm trying to count the number of lines in a string for each div. But I would also like to set a maximum number and if the string inside a div is equal/greater to that number to show a button.

Here's a codepen

jQuery:

$('.intro_text').each(function() {
   var lines = $(this).find("div").val().split("\n");  
   var maxLine = 5;
   if(lines > maxLine){
      $(this).after("<button>toggle</button>");
   }
 });

Use .html() instead of val(), a div doesnt have a val – Grumpy Jan 24 '20 at 15:36 — Grumpy, Jan 24 '20 at 15:36

score 1 · Accepted Answer · answered Jan 24 '20 at 15:46

1

You are not counting the length of array returned when you split the text of the divs. Change your code to this.

$('.intro_text').each(function() {
  var lines = $(this).find("div").text().split("\n").length;  
  var maxLine = 5;

  if(lines >= maxLine){
    $(this).after("<button>toggle</button>");
  }
});

answered Jan 24 '20 at 15:46

Qonvex620

3,819
1
8
15

Thanks. I had read up on length before but I thought it was the wrong property to use – Shanice Morgan Jan 24 '20 at 15:53
1

glad to help you, happy coding :) – Qonvex620 Jan 24 '20 at 15:55

How to count lines within an element and set a maximum?

1 Answers1