title: selective stoppropagation jquery
body: <p>Javascript code:</p>
  
  <pre><code>$(".div1").click(function(event){
      event.stopPropagation();
      $(".div1 div").slideToggle();
  });
  
  $(".div2").click(function(event){
      event.stopPropagation ();
      $(".div2 div").slideToggle();
  });
  
  $(document).click(function(event){
      $(".div1 div,.div2 div").slideUp();
  });
  </code></pre>
  
  <p>Suppose I click <code>.div1</code> &amp; <code>.div1 div</code> slides down. Then i click <code>.div2</code> But as <code>event.stopPropagation</code> is executed, <code>.div1 div</code> doesnot slide up. So what should i do? I dont want to put this code <code>$(".div1 div").slideUp();</code> as it makes no sense when there'll be too many divs like this</p>