Set InnerHTML value to Null

TheVillageIdiot27 · Feb 15, 2007

I am having a problem with a DIV that sits in a list like this:

Code:

<ul>
  <li id="folder1" class="closed">
    <a href="javascript:ajaxfunction('1')">Item 1</a>
    <div id="files1"></div>
  </li>
  <li id="folder2" class="open">
    <a href="javascript:ajaxfunction('2')">Item 2</a>
    <div id="files2"></div>
  </li>
  <li id="folder3" class="closed">
    <a href="javascript:ajaxfunction('3')">Item 3</a>
    <div id="files3"></div>
  </li>
</ul>

the javascript 'ajaxfunction' checks the class of list item above it then either writes a sub list to the div using an ajax function

Code:

.innerHTML = xmlHttp.responseText;

if the class is closed (then updates the class to open), or if the class is open

Code:

.innerHTML = '';

However this is the bit that is letting me down. In Firefox it works fine but in IE, when the close action happens it leaves a small gap where the responseText use to be.

Is setting the innerHTML property of the div to '' different to setting it to null, which I assume is it's original state which displays fine?

Thanks in advance for any help recieved.

TheVillageIdiot27 · Feb 15, 2007

I have got round this by adding a class to the div and the following CSS but would still be interested in innerHTML answer.

Code:

ul li.open .files
{
  display: block;
}
ul li.closed .files
{
  display: none;
}

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Set InnerHTML value to Null

TheVillageIdiot27

Programmer

TheVillageIdiot27

Programmer

Similar threads

Part and Inventory Search

Sponsor