Nested accordion problems

Nested accordion problems

Hi, im pretty new to jquery and trying out nested accordion and i ran into some problems. I dont know if its my lack of javascript/jquery knowledge or a bug in jquery.

First issue is that the accordians starts expanded, i want it to start collapsed except the top element.

The other problem is that i cant put text inside a accordian element that has a nested accordion. what happends is that the text dissapare or the nested accordion disapear..

The height seems to live its own life aswell

Am i doing it all wrong and is it a solution to my problem?

Html:
<div class="level1Container">
          <div class="level1Header">Bunt 10001</div>
              <div class="accordion_content">
                 <table>
                 <tr>
                 <td>Test1</td>
                 <td>Test2</td>
                 <td>Test3</td>
                 </tr>
                 <tr>
                 <td>Test11</td>
                 <td>Test22</td>
                 <td>Test33</td>
                 </tr>
                 </table><!-- I know table is bad, just a quick solution -->
                  <div class="nested_container">
                      <div class="level2Header">Invoice 20001</div>
                      <div class="accordion_content">
                          asfdasf
                      </div>
                     <div class="level2Header">Invoice 20002</div>
                      <div>
                          <p>Innhold 1.2</p>
                      </div>
                      <div class="level2Header">Invoice 20003</div>
                      <div>
                          <p>Innhold 1.3</p>
                      </div>
                  </div>
              </div>
          <div class="level1Header">Bunt 10002</div>
              <div class="accordion_content">
                  Temp data1
              </div>
          <div class="level1Header">Bunt 10003</div>
              <div class="accordion_content">
                  Temp data2
              </div>
       </div>


JQuery:
$(function() {
    $(".level1Container").accordion({
        header: ".level1Header",
        fillSpace: true
    });
});

$(function() {
    $(".nested_container").accordion({
        header: ".level2Header",
        fillSpace: true
    });
});


CSS:
.level1Container
{
   border:1px solid black;
   font-family:verdana;
   margin: 15px 15px 15px 235px;
   /*width:260px;*/
}

.level1Container div {
   background-color:#EEEEEE;
}

.level1Container h1.selected {
   background-color:#80CFE2;
   color:black;
}
.level1Header {
   background-color:#00A0C6;
   background-image:url(AccordionTab0.gif);
   border-bottom:1px solid #999999;
   border-top:1px solid #FFFFFF;
   color:black;
   cursor:pointer;
   display:block;
   font-size:14px;
   font-weight:bold;
   margin-top:0;
   /*padding:5px;*/
   text-decoration:none;
}

.level1Container p {
   border-style: none;
   border-color: inherit;
   border-width: medium;
   font-size:10px;
   margin:0;
   padding:10px;
   text-decoration:none;
   width: 146px;
}

.nested_container
{
   border:1px solid;
  padding-bottom:5px;
}

.level2Header
{
   background-color:#00A0C6;
   background-image:url(AccordionTab0.gif);
   border-bottom:1px solid #999999;
   border-top:1px solid #FFFFFF;
   color:black;
   cursor:pointer;
   display:block;
   font-size:12px;
   font-weight:bold;
   margin-top:0;
   /*padding:5px;*/
   text-decoration:none;
}

.accordion_content
{
   padding: 10px;
   background-color:#00A0C6;
}