jQuery Forum

I'm trying to put an xml loop in a jQuery UI accordion, but it's only the first loop that gets displayed in the accordion, the rest of the loops goes outside for some reason.

How can I make it work with each loop?

This is the accordion script (I've taken out the xml url and foreach stuff for simplicity)

2.   $(function() {
3. $( "#accordion" ).accordion({
4.     heightStyle: "content",
5.     collapsible: true,
6.     active: false,
7.     activate: function( event, ui ) {
8.       if(!$.isEmptyObject(ui.newHeader.offset())) {
9.       $('html:not(:animated), body:not(:animated)').animate({ scrollTop: ui.newHeader.offset().top }, 'slow');
10.       }
11.     }
12.   });
13. });

And this is what is supposed to be looped

2. $x = 0;
3. while($x <= 20) {
4. <div id='accordion'>
5.   <div class='accord-header'>
6.     <div class='titellinie'>$stilling - $firma</div>
7.   </div>
8.   <div class='accord-content'>
9.     <div class='main-wrap'>
10.       <div class='banner'><img src='$banner'></div>
11.       <div class='main-content'>$stilling<br>$stillingsbeskrivelse</div>
12.   </div>
13.   <div class='sidebar-wrap'>
14.     <div class='sidebar-content'><img src='$kundelogo'>$intro</div>
15.   </div> 
16.   </div>
17. </div>";
18. $x++;
19. }

I've used a different type of jQuery accordion, which looped perfectly, but I was unable to make it scroll like i wanted to, when the accordion opened up, hence the switch to jQuery UI.

The first accordion, which works, is set up the same way as my non-working accordion, which is baffling me a bit.

Working accordion, can be seen here http://kreuzwerk.dk/dev/hrmanxmlacc/

Non-working accordion is here: http://kreuzwerk.dk/dev/hr-manager-xml-acc-alt/