I'm trying to write some js that will add a <link> element to add a stylesheet to a page. I'm working with some old software that generates web pages that allow users to see architectural plans and click on spaces in the plan to get info on that space. It creates four files, a "top" html file that defines two frames, the html files for the two frames, and a js file that constructs the left frame onload.

Its the left frame that I want to add a CSS link to. The entire contents of the left frame html file is:
Code:
<html>
    <body bgcolor='#d4d0c8' onload='top.ShowSPACES(-1)' >
    </body>
</html>
The ShowSPACES() basically re-writes the file line by line with document.writeln() to create a form with a series of input fields where data is displayed.
For a variety of reasons I don't want to change the js file. Instead I created my own js file and called ShowSPACES() and then my own function to insert the LINK element. I replaced "top.ShowSPACES(-1)" with my function "top.buildDataFrame()" which looks like this (note, the name of the left frame is fdatabase):

Code:
function buildDataFrame() {
  ShowSPACES(-1);
  insertCSS();
}

function insertCSS() {
  var theHead = document.createElement('head');
  var CSSLink = document.createElement('link');

  CSSLink.setAttribute('rel', 'stylesheet');
  CSSLink.setAttribute('type', 'text/css');
  CSSLink.setAttribute('href', 'spaceDB_data_style.css');
  theHead.appendChild(CSSLink);
  
  var theBody = fdatabase.document.getElementsByTagName('body')[0];
  theBody.parentNode.insertBefore(theHead, theBody);
}
This works perfectly well in Firefox and Chrome, but in IE 8 it does not add the new nodes. ShowSPACES() runs and generates the content, but the <head> and <link> elements do not appear.

I inserted alert()'s to check here and there and it does create the nodes and set the attributes, and it does get the <body> element, but it doesn't add the new nodes.

Is there an IE specific quirk am I running afoul of?