title: Convert html code into plain text inside a div or textarea
body: <p>might be a stupid question but nonetheless here it goes. I am having difficulty converting html code into plain text to be viewed preferably inside a textarea form field, but a div will do. </p>
  
  <p>Here is what I have found:</p>
  
  <p>html: </p>
  
  <pre><code>&lt;div class="box-checkbox-color"&gt;
  
          &lt;input type="checkbox" name="Color:_Green"  id="sku0001-green" value="Yes" /&gt;
          &lt;label for="sku0001-green"&gt;&lt;/label&gt;
          &lt;div style="display:none;" title="#" class="rawHTML-code-insert"&gt;This is where I would like to display raw HTML code BUT have it rendered as plain text instead of being read as markup, essentially need it to be presented so it can be copied and pasted&lt;/div&gt;
      &lt;/div&gt;
  
  
  &lt;div class="box-checkbox-color"&gt;
  
          &lt;input type="checkbox" name="Color:_Green2"  id="sku0001-green2" value="Yes" /&gt;
          &lt;label for="sku0001-green2"&gt;&lt;/label&gt;
          &lt;div style="display:none;" title="#" class="rawHTML-code-insert"&gt;This is where I would like to display raw HTML code BUT have it rendered as plain text instead of being read as markup, essentially need it to be presented so it can be copied and pasted into a form field to be sent to another .php page&lt;/div&gt;
      &lt;/div&gt;
  
  
  &lt;ul class="result"&gt;&lt;/ul&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>$('input[type="checkbox"]').click(function(){
      var title = $(this).closest('.box-checkbox-color').find('.rawHTML-code-insert').html();
      // If the checkbox is checked, add the item to the ul.
      if($(this).attr('checked')){
          var html = '&lt;li title="' + title + '"&gt;' + title + '&lt;/li&gt;';
          $('ul.result').append(html);
      } else {     
          // if the checkbox is unchecked, remove the item from the ul.
          $('li[title="' + title + '"]').remove();
      }
  });
  </code></pre>
  
  <p>What I need to accomplish with this is to show/generate a specific block of code when the user checks a specific checkbox, but I would like that code to be readable as code rather than it being read as markup and executed as such. Point is to provide the code so users can copy and paste it, and make modifications to div name, id's, values, etc... if they want to. And of course, different code will appear for each checkbox and be listed together in the ul class below. I provided a js fiddle that should illustrate what I need.</p>
  
  <p>I have provided a <a href="http://jsfiddle.net/ek2zh/122/" rel="nofollow">js fiddle</a> example of what I'm talking about.</p>