title: jQuery toggle not staying open
body: <p>trying to toggle a div to expand and contract, it is basically a menu, with subnav. so i initially set height to 48px to hide subnav and in case there is no JS it will still look decent, I then assign a toggle to open and close the div (in this case set the height)</p>
  
  <p>it keeps refreshing and automatically opening the div though. doesn't want to stay open, just expands, gives alert, then closes again.</p>
  
  <pre><code>jQuery(document).ready(function($) { 
  $('#nav-wrapper').css('height','48px');
    $('#menu-item-18').click(function() {
      var open = false;
      if(isOpen) {
        $('#nav-wrapper').animate({ height: '-=44' }, 0, function() {}); 
        var isOpen = false;
        alert ('not open')
      } else { 
        $('#nav-wrapper').animate({ height: '+=44' }, 0, function() {}); 
        isOpen = !isOpen; 
        alert ('open') 
      };
    });
  }); 
  </code></pre>
  
  <p>might be way overcomplicating this. I'm sure there is a simpler solution too.</p>