JSFiddle - React, Tailwind, and code Playground

HTML

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet">
    
<p>
	This is a sentence at the end of the first 100
	characters that gets truncated
	<span class="truncated">
		more text more text more
		text more text more text more text
		more text more text more text end of text.
	</span>
</p>

JavaScript

$('.truncated').hide()                       // Hide the text initially
    	.after('<i class="icon-plus-sign"></i>') // Create toggle button
    	.next().on('click', function(){          // Attach behavior
        $(this).toggleClass('icon-minus-sign')   // Swap the icon
            .prev().toggle();                    // Hide/show the text
    });