[SOLVED] Adding Widgets to a Header in an Accordion

[SOLVED] Adding Widgets to a Header in an Accordion

What I would like to do is have my accordion headers include a progress bar and maybe another label. So the idea would be like this:

  1. Header 1     =====-----  Label 1
    Header 2     ==--------  Label 2
I've seen techniques to add images to headers like this:

  1. <div data-role="header">
  2.   <div id="header1_progress" ></div>
  3.   <h3>Header 1</h3>
  4. </div>
  5. <div>Header 1 Content</div>


Is this the correct way to approach this problem? It feels a little hacky because the documentation mentions that the content div must follow the header immediately for the accordion to work right. This seems to work right, but I wanted to see if it was the wrong approach. Thanks!