jQuery Truncate
The jQuery Truncate plugin consists of 3 components that extend the jQuery object.
truncate: Get the truncated text and/or the last processed node of the first selected element.
closestChild: Get the closest parent that is a child of selector.
truncated: Make the selected elements truncated with a link to expand them.
Sponsored by Examiner.com. Licensed under GNU GPL v3.
HTML
<script src="https://raw.github.com/Poetro/jQuery-Truncate/master/jquery.truncate.min.js"></script>
<div id="content">
<p>Item text 1 for item 1.</p>
<p>Item text 2 for item 2.</p>
<p>Item text 3 for item 3.</p>
<p>Item text 4 for item 4.</p>
<p>Item text 5 for item 5.</p>
<p>Item text 6 for item 6.</p>
<p>Item text 7 for itemSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS 7.</p>
<p>Item text 8 for item 8.</p>
</div>
CSS
.element-hidden {
display: none;
}
JavaScript
$('#content').truncated(50);