CODEWITHSUNDEEP
javascriptjqueryhtml
StoneMan
StoneMan

Reputation: 423

jQuery UI accordion not working with Javascript

The accordion normally works when I am just using plain html.

However, I am using dynamic data, so I am implementing Javascript to create <div> and <h3> tags for the accordion.

I am using this snippet of code:

 $('#rangeInfo').append('<div id=\"accordion\">');
 for ( var obj in timeClusters) {
     $('#rangeInfo').append ('<h3> ' + timeClusters[obj].startReal + '</h3> <div>Information</div>'  );       
 }
 $('#rangeInfo').append('</div>');
 $(document).ready(function() {
     $("#accordion").accordion();
 });

Upvotes: 1

Views: 74

Answers (2)

Ram
Ram

Reputation: 144659

That's not how DOM works, you can't insert opening and closing tags separately. You should insert element.

$('<div id="accordion">').append(function() {
   return $.map(timeClusters, function(obj) {
      return '<h3>' + obj.startReal + '</h3><div>Information</div>';
   }).join('');
}).appendTo('#rangeInfo').accordion();

Upvotes: 2

Hogan
Hogan

Reputation: 70513

</h3 <div>Information</div> is missing a >

also

'<div id=\"accordion\">' can be '<div id="accordion">'

Upvotes: 0

Related Questions