How to HTML encode contents of a div in jQuery for use in Ace editor?

Question 1

I ran into lots of problems when trying to implement this.

Basically <html> tags were always stripped out and I couldn't find a way to access the html markup before the tags were stripped or to encode the html within the div containing the markup. jQuery's text() and html() and various combinations of them did not work.

Solution

This was the solution that eventually worked for me.

http://jsfiddle.net/rwone/rAFSZ/1/

HTML

<div id="my_html"></div>

<!-- this works using <xmp> tags and NOT when using <div> tags -->

<xmp id="my_html_hidden"><html>test</html></xmp>

jQuery

The approach I used was to set the value like this:

var html_editor = ace.edit("my_html");
// other editor settings
html_editor.session.setValue($("#my_html_hidden").text());

So the logic of this is that the content was loaded into a hidden div from the database, and then the value of the editor was set with the contents of this hidden div, with the text() method applied.

The key was that using <xmp> tags did NOT strip the <html> tags, whereas using <div> tags did.

Question 2

A few major issues with your code. Here's what I did that works:

HTML

<div id="encode_me"><div>test</div></div>

JS

my_value = document.getElementById("encode_me").innerHTML;
my_value = $('<div/>').text(my_value).html();
$('div').text(my_value);

You can't have <html> as a tag. It gets ignored. Replace it with <div>, and you can then get innerHTML.
You can avoid jQuery as I did, or use it as my_value = $("#encode_me")[0].innerHTML;
For the selector to change the text, just look for a div, not a div end tag with the <>.

Looking through the answer you reference, the $('<div/>') stuff is used to create a new div that isn't added to the DOM, and use that for the HTML manipulation. After getting the innerHTML, I use that trick to encode the parts that need encoding. (If there was a text node inside the div, innerHTML would automagically convert that, but since it's all standard divs, it doesn't.)

Unfortunately, the <html> tag is only used "as the root element of a document, or wherever a subdocument fragment is allowed in a compound document." I expect innerHTML to emit that tag properly if its use is standards-conforming, but the example in your fiddle was not.