The problem with what you’re trying to do is that you split a block type html element <p>. In your example you effectively have <p><div></p></div>, which is simply no good. So you cannot mix <p> and <div> in this way. You can, however use a combination of paragraphs and classes:
<p>Text</p><p class="hide-from-here">More text</p>
Where it might be handy to expand </p><p class="hide-from-here"> from a shortcode. You could also generate your link with the same shortcode. You can make sure the paragraph with the hide-from-here class behaves as if it isn’t there using css.
Now you still need to hide the remaining paragraphs. Here jquery’s .nextAll comes in handy to give all remaining paragraphs the class
$("p:hide-from-here").nextAll().addClass( "following-paragraphs" );
On this class you define display:hidden, which you toggle with the link (or you remove the class).