jQuery - Accordion boxes

I have a series of boxes/blocks of content on a form that need to just show the title of the box, with a 'View More' button below it. When a user clicks View More, the box should expand vertically to show its co开发者_如何转开发ntents. Also, when another 'View More' is clicked, any other open boxes need to close.

How can I accomplish this with jQuery? I thought maybe I could use the Accordion plugin, but that sounds like it only works with list displays.

Example:

Box Title

View More!

*user clicks

Box Title

• Content
• Content
• Content
• Content

Close

---

The jQuery UI Accordion plugin doesn't rely on lists, you can use markup like this:

<div id="accordion">
  <h3><a href="#">First header</a></h3>
  <div>First content</div>
  <h3><a href="#">Second header</a></h3>
  <div>Second content</div>
</div>

---

http://jqueryui.com/demos/accordion/ Look at the theming tab, it doesn't use lists.