jquery toggling a div - how to do this with multiple ids?
<p>I am new to Jquery.  My setup is as follows:</p>

<p>I have a series of divs that need to be able to be toggled (display hidden and shown).  Each div has an action that can be performed so a unique ID will be necessary to know from which div the event came from.</p>

<p>To toggle the div I have a button for each div (which is not located within the div to be toggled).</p>

<p>Right now without jquery, I use the button's onclick event to pass the ID of the corresponding div to be toggled.  Using the unique ID I can do the following:</p>

<pre><code>function toggleFlag(divId) {
    var div = document.getElementById(divId);
    div.style.display = (div.style.display=="block" ? "none" : "block");
}
</code></pre>

<p>divId is unique so I also know where the event comes from if action within the div is performed.</p>

<p>the anchor code looks something like this:</p>

<pre><code>onclick="toggleFlag('id-111');"
</code></pre>

<p>where the '111' is the unique id</p>

<p>First off, is it even worth it to use jquery for this if the extent of my javascsript isn't much more complicated (aside from maybe simple ajax).</p>

<p>More importantly, how would this properly be done using jquery?</p>

<p>Update: I am very close to solving this.  I managed to get it to work using one of the suggestions below requiring unique class names for each button.  A couple of the methods suggest implementations where the class name is the same for all buttons (I want this in order to be able to statically assign styles to the button class), but I could not get these to work.  Could somebody please elaborate on the solution?  Thanks!</p>
