Greetings, based on the jquery ui accordion I'm using, I have added a slide toggle to my accordion list items. so what happens is I click on an li and a div slides down underneath to reveal more content.

The issue I'm having is that I find myself having to create multiple id's to reference the slidetoggle.

example of the div id css: #panel, #panel2, #panel3, #panel4, etc.... the

Is there a way I can use the slide toggle without having to adding another number so it will slide? I have 50 list items I'm using:

Here's a sample of the js (as you can see where I'm going with this):

 $(".btn-slide").click(function(){
   $("#panel").slideToggle("slow");
   $(this).toggleClass("active"); return false;
 });
 $(".btn-slide2").click(function(){
   $("#panel2").slideToggle("slow");
   $(this).toggleClass("active"); return false;
 });  

sample html:

  <li><div class="slide"><a href="#" class="btn-slide">One</a></div><div id="panel"></div></li>

  <li><div class="slide"><a href="#" class="btn-slide2">Two</a></div><div id="panel2"></div></li>