js 메뉴 클릭시 펴졌다 접혔다 하는..부분

<div class="table_in_out" style="width:842px;">
     <script type="text/javascript">
      function tab(none,block)
      {
       document.getElementById(none).style.display='none';
       document.getElementById(block).style.display='block';
      }
     </script>
     <ul id="tabclose" style="display:block;"> <<----- 펴지는 부분
      <li class="list01">
       <span class="titleft"><img style="cursor:pointer; float:left; padding:8px 0 0 10px;" onclick="tab('tabclose','tabopen');" src="../../images/sub_clinic01_list_03_01.gif" /></span>
       <span class="nextfont"><img style="cursor:pointer;" onclick="tab('tabclose','tabopen');" src="../../images/sub_clinic01_list_pre.gif"/></span>
      </li>
      <li class="">
       <img src="../../images/sub_clinic01_cont_03_01.gif" /> <<-------- 내용물
      </li>
     </ul>
     <ul style="display:none;" id="tabopen"><<------ 접히는 부분
      <li>
       <span class="titleft"> <img style="cursor:pointer; float:left; padding:8px 0 0 10px;" onclick="tab('tabopen','tabclose');" src="../../images/sub_clinic01_list_03_01.gif" /></span>
       <span class="nextfont"><img style="cursor:pointer;" onclick="tab('tabopen','tabclose');" src="../../images/sub_clinic01_list_next.gif"/></span>
      </li>
     </ul>

</div>