Jquery Accordion Trouble - Nesting

Question

Hello,

I have successfully created a few single accordion drop-downs, but when I go to nest an accordion with an accordion, internet explorer goes nuts (but Firefox, Chrome, etc work just fine for both the single and nested accordion).

Here is an example of the single accordion (fully functional):

<div id="productdd">
  <h3><a href="#">Fire Pump Controllers </a></h3>
    <div>
      <ul>
   <li class="general"><a href="General Controller.html">General Selection Information</a></li>    
      <li class="colors"><a href="Variable Speed.html" ><b>ECV </b><p class="black">- Variable Speed Controller</p></a></li>
      <li class="colors"><a href="EC Controller.html" ><b>EC</b><p class="black"> - Enhanced Controller</p></a></li>
      <li class="colors"><a href="MC Controller.html" ><b>MC</b><p class="black"> - Motor Drive Controllers</p></a></li>
      <li class="colors"><a href="Diesel Controller.html" ><b>DMC</b><p class="black"> - Diesel Controller</p></a></li>
      </ul>
    </div>
<div>

And here is an example of what I'm working on for the nested version:

     <div class="accordiondd">
  <h3 class="indenting"><a href="#">EC Drawings</a></h3>
   <div>
     <ul class="right2">
    <div class="accordiondd">
     <h3 class="secondaryh3"><a href="#"> General</a></h3>
      <div>
       <ul class="right2a">
        <a href="PDFs/EC/WB12098.doc" target="_blank"> 12098 - EC*: <p class="black3"> Order Selection Sheet </p></a>
       </ul>
      </div>      
     <h3 class="secondaryh3"><a href="#"> Dimensionals </a></h3>
      <div>
       <ul class="right2a">
        <a href="PDFs/EC/ECA,ECP,ECO std DIM 12001.pdf"target="_blank"> 12001 - ECA/ECO/ECP: <p class="black3"> 24" Wide  x  64" High  x  13" Deep - 1 Bay Enclosure</p></a>
       </ul>
      </div>              
    </div>
     </ul>
   </div>    
 </div>

If anyone has any idea why all browsers but IE would work with this code let me know! It's driving me nuts ;( And thanks, I really really appreciate it!

EDIT:

Jquery Code for single accordion:

$(function() {
$("#productdd").accordion({autoHeight: false,collapsible: true,active: whichToOpen});
});

Jquery Code for nested accordion:

$(document).ready(function() {
$(".accordiondd").accordion({autoHeight:false,collapsible:true,active:false});
});

Answer 1

This is a long shot but can you try adding header: 'h4' to your nested accordion script and replacing the inner 'h3's with 'h4's?