Limit 100 maximum characters in a div and generate read more button when exceed in css or js

Question

This is my existing work. I made it to limit the characters up to 30 but how would I add a read more link to my other page dynamically when characters exceed the limit? i need your help guys.

var myDiv = $('.wwdtext');
myDiv.text(myDiv.text().substring(0,30))

<div style="background-color:#FF6201;width:220px;height:220px">
    <div class="wwdtext">Hello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello World</div>
</div>

`truncated = truncated.substr(0,maxLength) + '...'+truncated.substr(maxLength)+'';` - now wire up class more to show next sibling — mplungjan, Mar 08 '18 at 08:43
is it like this? var myDiv = $('.wwdtext'); truncated = truncated.substr(0,50) + '...'+truncated.substr(50)+''; — user3117337, Mar 08 '18 at 08:58

Hasan Haghniya · Answer 1 · 2018-03-08T08:42:46.860

0

var myDiv = $('.wwdtext');
myDiv.text(myDiv.text().substring(0,100))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="background-color:#FF6201;width:220px;height:220px">
    <div class="wwdtext">Hello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldeqwrewqjkfbsajHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldeqwrewqjkfbsajHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello WorldHello Worldeqwrewqjkfbsaj</div>
</div>

edited Mar 08 '18 at 08:42

answered Mar 08 '18 at 08:34

Hasan Haghniya

2,347
4
19
29

How do i get a button with that? – user3117337 Mar 08 '18 at 08:40
I need to have a read more link or button when it exceeds the character limit. – user3117337 Mar 08 '18 at 08:44
@user3117337 add `` before `
` tag , also add ``
– Hasan Haghniya Mar 08 '18 at 08:45
I tried this on jsfiddle but still doesnt generate the button. – user3117337 Mar 08 '18 at 08:50
I need to dynamically add a button when it exceeds the limit.. plss heeelp – user3117337 Mar 08 '18 at 09:01
did you find the solution? – Hasan Haghniya Nov 24 '19 at 10:36

Limit 100 maximum characters in a div and generate read more button when exceed in css or js

1 Answers1