title: how to make a jquery chart with expandable box with only one expanded box at a time?
body: <p>I'm working on a jquery chart with expandable box. The main problem is when one box is open and I go to open another, the first one doesn't close. How to make the script that when the second box open and first box close?</p>
  
  <p>I try to use the code in one of the answers here but somehow I cant make it work. Thanks</p>
  
  <p>html:</p>
  
  <pre><code>&lt;h2 class="trigger"&gt;&lt;a href="#"&gt;click to see more&lt;/a&gt;&lt;/h2&gt; 
  &lt;div class="toggle_container"&gt; 
      &lt;div class="block"&gt; 
        &lt;h3&gt;one&lt;/h3&gt;
          &lt;p&gt;Consequat te olim letalis premo ad hos olim odio olim indoles ut venio iusto. Euismod, sagaciter diam neque antehabeo blandit, jumentum transverbero luptatum. Lenis vel diam praemitto molior facilisi facilisi suscipere abico, ludus, at. Wisi suscipere nisl ad capto comis esse, autem genitus. Feugiat immitto ullamcorper hos luptatum gilvus eum. Delenit patria nunc os pneum acsi nulla magna singularis proprius autem exerci accumsan. &lt;/p&gt; 
  
          &lt;p&gt;Praesent duis vel similis usitas camur, nostrud eros opes verto epulae feugiat ad. Suscipit modo magna letalis amet et tego accumsan facilisi, meus. Vindico luptatum blandit ulciscor mos caecus praesent sed meus velit si quis lobortis praemitto, uxor. &lt;/p&gt; 
      &lt;/div&gt; 
  &lt;/div&gt; 
  
  &lt;/div&gt;
  </code></pre>
  
  <p>jquery:</p>
  
  <pre><code>$(".toggle_container").hide();
  
  $("h2.trigger").click(function(){
      $(this).toggleClass("active").next().slideToggle("slow");
  });
  </code></pre>