Kumar Kumar - 3 months ago 8
Javascript Question

hiding one div tag hides others

When I hide "div1Title", the other divs also hiding. Is there anything I can do to solve this issue?

<div id="div1Title" style="visibility: visible;display:inline">
<table class="htmlrtabledata" style="width:1000px">
<TR>
<td style="width:20px">
<img id="div1Plus" src="images/Plus.jpg" width="20px" height="20px" onclick="onClickSubReport('div1', event, this)">
</td>
<td id="div1TitleText"></td>
</TR>
</table>
<div>
<div id="div2Title" style="visibility: visible;display:inline;">
<table class="htmlrtabledata" style="width:1000px">
<TR>
<td style="width:20px">
<img id="div2Plus" src="images/Plus.jpg" width="20px" height="20px" onclick="onClickSubReport('div2', event, this)">
</td>
<td id="div2TitleText"></td>
</TR>
</table>
<div>




My JS:

document.getElementById("div1Title").style.display = "none";
document.getElementById("div1Title").style.visibili‌​ty = "hidden"

Answer

Closing the div tags should work. Currently you are nesting the second div by accident.

<div id="div1Title" style="visibility: visible;display:inline">
  <table class="htmlrtabledata" style="width:1000px">
    <TR>
      <td style="width:20px">
        <img id="div1Plus" src="images/Plus.jpg" width="20px" height="20px" onclick="onClickSubReport('div1', event, this)">
      </td>
      <td id="div1TitleText"></td>
    </TR>
  </table>
</div><!-- HERE -->
<div id="div2Title" style="visibility: visible;display:inline;">
  <table class="htmlrtabledata" style="width:1000px">
    <TR>
      <td style="width:20px">
        <img id="div2Plus" src="images/Plus.jpg" width="20px" height="20px" onclick="onClickSubReport('div2', event, this)">
      </td>
      <td id="div2TitleText"></td>
    </TR>
  </table>
</div>