title: Simulate paste into Textarea with javascript
body: <p>When pasting data from the clipboard into an html textarea, it does some pretty cool parsing to make the paste look close to what was copied as far as newlines go.</p>
  
  <p>For example, I have the following html on a page that I select (everything highlights in blue) and then I <code>copy</code> it:</p>
  
  <pre><code>Hello
  &lt;br&gt;
  &lt;br&gt;
  &lt;br&gt;
  &lt;div&gt;more&lt;/div&gt;
  &lt;div&gt;last&lt;/div&gt;
  </code></pre>
  
  <p>So to be clear, what I am copying is what the output of <a href="http://jsfiddle.net/92gu2o94/2/" rel="nofollow">this jsfiddle</a> looks like.</p>
  
  <p>Now when I paste this magical, copied text into a text area, I see exactly what I would expect: <code>"Hello", empty line, empty line, empty line, "more", "last"</code>. Cool! Then when I use jQuery's .val() on the textarea, I get <code>"Hello\n\n\nmore\nlast"</code>. Super cool. It took the <code>br</code>'s and <code>div</code>'s and was able to infer the correct newlines from it.</p>
  
  <p>Now...</p>
  
  <p>What I am trying to do it programmatically take the same data I copied earlier and set it as the textarea's value as if it were pasted.</p>
  
  <p>Here is what I have tried...</p>
  
  <p>So, say the stuff I copied earlier was wrapped in a <code>&lt;div id="parent"&gt;...&lt;/div&gt;</code>.</p>
  
  <pre><code>var parent = $("#parent");
  var textarea = $("#theTextArea");
  
  // Set the value of the text area to be the html of the thing I care about
  textarea.val(parent.html());
  </code></pre>
  
  <p>Now I know this isn't the same as a copy-paste, but I was hoping it would take care of me and do what I wanted. It doesn't. The textarea gets filled with <code>Hello&lt;br&gt;&lt;br&gt;&lt;br&gt;&lt;div&gt;more&lt;/div&gt;&lt;div&gt;last&lt;/div&gt;</code>. The html that was once invisible is now stringified and made part of the text.</p>
  
  <p>Obviously I did this wrong. .html() returns, of course, the string of html. But is there something I could call on <code>parent</code> that would give me the text with all inferred linebreaks?. I have tried calling <code>parent.text()</code>, but this only gives <code>Hellomorelast</code> (no line breaks).</p>
  
  <p>A few notes that could help with an answer: I am using Angular, so I have access to all their goodies and jQuery.</p>