SlideToggle on multiple divs to maintain state during postbacks

SlideToggle on multiple divs to maintain state during postbacks

I have jscript to toggle divs to slide up and down. I would like to maintain the state of these divs  (open or closed) during postbacks. I read on other posts I can use cookies and hidden fields, but I don't know how to use it when using multiple divs with my jscript.

How can I maintain the state of the divs so that it stays open/collapsed during postbacks.  How will I pass parameters to the jscript?

Jscript:

<script type="text/javascript"> 
   $(document).ready(function () { 
       $(".toggle").slideUp(0); 
       $(".trigger").click(function () { 
            $(this).next(".toggle").slideToggle("slow"); }); 
}); </script> 

HTML:

<h3 class = "trigger">Section 1</h3> 
   <div class = "toggle"> 
      <p> Item 1 </p> 
   </div> 
<h3 class = "trigger">Section 2</h3> 
   <div class = "toggle"> 
      <p> Item 1 </p> 
   </div>