title: Uncaught TypeError: Cannot read property 'height' of undefined
body: <p>I have a problem with opening/closing boxes. Scenario suppose work like this: If one box is opened, when user clicks on some another, opened box should be closed and clicked one should be opened. When link(box) is opened, in <li> tag should be inserted class="active" and when box is closed this class should be removed. Now user can open all boxes and all stay opened until user clicks on them again to close them.  Alos with current code when user open more than two boxes all boxes opened after these two won't get "active" class.
  I'm getting this error message "Uncaught TypeError: Cannot read property 'height' of undefined ".
   May anyone help me to solve this?
  This is code</p>
  
  <pre><code>$(document).ready(onReady);
  
  function onReady(){
  $(".glossary").each(init);
  }
  
  var init=function(){var rootElement=this;
  $("ul li:odd", rootElement).addClass("odd");
  $("ul li:even", rootElement).addClass("even"); 
  $(rootElement).delegate("ul li a", "click", function(e){
  toggleItem($(this).next("div"), $("ul li div", rootElement));
  })
  }
  
   var toggleItem =function (item, set){
      if ($(item).hasClass("active")){
        deactivateItem(item);
      }
     else{
        activateItem(item, set);
      }
    }
  
    var activateItem = function(item, set){
  
    $(item).slideDown();
      $(set).filter(".active").each(deactivateItem);
      $(item).addClass("active");
    }
  
     var deactivateItem = function (item){
    $(item).slideUp();
      $(item).removeClass("active");
    }
  </code></pre>
  
  <p>and this is some HTML code</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;script src="http://code.jquery.com/jquery-1.8.3.min.js"&gt;&lt;/script&gt;
  &lt;script src="test1.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div class="glossary"&gt;
  &lt;ul&gt;
  
          &lt;li &gt;
            &lt;a href="#"&gt;Rose&lt;/a&gt;
            &lt;div class="" style="display: none;"&gt;A rose is a woody perennial of the genus Rosa, within the family Rosaceae. There are over 100 species.&lt;/div&gt;
          &lt;/li&gt;
  
          &lt;li &gt;
            &lt;a href="#"&gt;Camomile&lt;/a&gt;
            &lt;div class="" style="display: none;"&gt;Chamomile or camomile  is the common name for several daisy-like plants of the family Asteraceae that are commonly used to make a herb infusion that can help to induce sleep&lt;/div&gt;
          &lt;/li&gt;
  
          &lt;li &gt;
            &lt;a href="#"&gt;Mentha&lt;/a&gt;
            &lt;div class="" style="display: none;"&gt;Mentha is a genus of plants in the family Lamiaceae (mint family).The species are not clearly distinct and estimates of the number of species varies from 13 to 18.&lt;/div&gt;
          &lt;/li&gt;
  
          &lt;li &gt;
            &lt;a href="#"&gt;Viola&lt;/a&gt;
            &lt;div class="" style="display: none; overflow: hidden;"&gt;Viola  is a genus of flowering plants in the violet family Violaceae. It is the largest genus in the family, containing between 525 and 600 species.&lt;/div&gt;
          &lt;/li&gt;
  
        &lt;/ul&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>