TypeError: $(...).substring is not a function

Question

I'm looping through every selected element to truncate it to ~ 10 letters.

However I'm getting a TypeError: $(...).substring is not a function and not sure why. Here's my code:

$('.post_text_div h1').each(function (e) {
    var truncated = $(this).substring(0, 10)
    // console.log('Truncated:', truncated);
    $(this).text(truncated);
});

Any idea why?

Answer 1

You have to apply substring() on the text of the element, not on the element itself:

Change

var truncated = $(this).substring(0, 10)

To

var truncated = $(this).text().substring(0, 10)