Jquery help on sliding divs
<p>Here is the HTML</p>

<pre><code>&lt;div id="projectheader"&gt;
Project 1
&lt;span id="plus"&gt;+&lt;/span&gt;&lt;/div&gt;
&lt;div class="projectdrop"&gt;
&lt;div id="orderheader"&gt;&lt;span id="plus"&gt;+&lt;/span&gt;&lt;/div&gt;
&lt;div class="orderdrop"&gt;&lt;/div&gt;
&lt;/div&gt;

&lt;div id="projectheader" style="margin-top: 20px;"&gt;
Project2
&lt;span id="plus"&gt;+&lt;/span&gt;&lt;/div&gt;
&lt;div class="projectdrop"&gt;
&lt;div id="orderheader"&gt;&lt;span id="plus"&gt;+&lt;/span&gt;&lt;/div&gt;
&lt;div class="orderdrop"&gt;&lt;/div&gt;

&lt;/div&gt;
</code></pre>

<p>Im working on a site where the projects are created dynamically on the back end and the info is inserted into the projectheader on the front end. So there could be many div's with the ID of projectheader on the same page.
What I'm looking to do is click on the + div and slide down the projectdrop. This is not a problem with only one project on the page but not able to get it working when multiple projectheader are on the page. I want to be able to slidedown only the specific projectheader I click on. </p>

<p>Thanks in advance.</p>
