jquery - using substr to limit characters inside of an element -

i paginating users , in view have:

<li class="profile">   <%= user.profile %>  </li> 

i want limit li.profile 200 characters followed 3 dots '...'

below not work:

$(document).ready(function(){    $("li.profile").each(function(){        if ($(this).html().length > 200) {            $(this).html($(this).html().substr(0, 200));              $(this).append('...');         }     }); }); 

this way looks in developer tools.

css

li.profile { font-size: 14px; padding-bottom: 5px; text-align: left; padding-left: 5px; } 

use .text(); .html() sets .innerhtml of element, not .textcontent

$(document).ready(function(){    $("li.profile").each(function(){        if (this.textcontent.length > 200) {            $(this).text(function(_, text) {              return text.substr(0, 200).concat("...");             })         }     }); });