jQuery text() call preserves newlines in Firefox but not in IE

It looks like this is my problem: The Internet Explorer innerHTML Quirk:

However, innerHTML has a problem in Internet Explorer.

The HTML standard requires a transformation on display of content. All kinds and amounts of adjacent whitespace are collapsed into a single space. This is a good thing - just as an example, it allows me to add a lot of line breaks into this source file without having to worry about weird line breaks in the displayed text.

Internet Explorer applies these transformations on assignment to the innerHTML property. This seems like a good idea: it saves a little time during display, because if the in-memory representation is already normalized, then the browser doesn't have to normalize whenever it needs to display the text.

There are exceptions to the normalization rule, though. Notably, these are the <textarea> element, the <pre> element and, in CSS-aware browsers, elements with any value but normal for the white-space property.

Internet Explorer does not respect these special cases. The third makes their optimization a bad idea, because white-space might change at runtime, for example through the DOM. In any case, Internet Explorer will normalize all assignments to the innerHTML property, thus causing the effect demonstrated below.

This text fills the textarea at page load. This, too, contains line breaks and multiple spaces. Formatting is preserved here as well, except that the UA may break lines.

(emphasis added)

And indeed if I change it to:

<div id="div">
<pre>
...
</pre>
</div>

and

$("#div pre").text()

or simply:

<style type="text/css">
#div { white-space: pre }
</style>

it all magically works.

Not sure if this would help, but maybe you could try this:

#div {
  white-space: pre;
}