title: jQuery dynamic accordion function
body: <p>Having a problem with using a function in my dynamic accordion divs.  </p>
  
  <pre><code>$(document).ready(function ()
  {
      $.ajax(
      {
          url: "accordion-query.php",
          dataType: "json",
          success: function (data)
              {
              var accord='';
  
              $.each( data, function( index, item)
                  {
                  var courseCode = item.Course_Code;
                  accord += '&lt;h3&gt;'+item.Course_Name+' - '+item.Course_Code+'&lt;/h3&gt;&lt;div&gt;'+createTable(courseCode)+'&lt;/div&gt;';
                  });
  
              $( "#accordion" ).html( accord );
              $( "#accordion" ).accordion();
              }
      });
  });
  </code></pre>
  
  <p>The <code>createTable(code) {}</code> function inside the accordion divs is not working
  function createTable(code)</p>
  
  <pre><code>function createTable(code) 
      {
      $.ajax(
          {
          url: "staff-query.php",
          data: "q=" + code,
          dataType: "json",
          success: function (data)
              {           
              $.each( data, function( index, item)
                  {
                  tabletext += '&lt;tr&gt;&lt;td&gt;'+item.B_Code+'&lt;/td&gt;&lt;td&gt;'+item.Surname+', '+item.FirstName+'&lt;/td&gt;&lt;td&gt;'+item.Email+'&lt;/td&gt;&lt;td&gt;'+item.Course_Name+'&lt;/td&gt;&lt;td&gt;'+item.Mod_Title+'&lt;/td&gt;&lt;td&gt;'+item.Title+'&lt;/td&gt;&lt;td&gt;'+item.Uploaded+'&lt;/td&gt;&lt;td&gt;'+item.ViewedDate+'&lt;/td&gt;&lt;td&gt;'+item.Comments+'&lt;/td&gt;&lt;/tr&gt;';
                  });
              }
      return tabletext;
      });
      }
  </code></pre>
  
  <p>The <code>accordion-query.php</code> and <code>staff-query.php</code> are both returning what i want them to, json encoded arrays with the correct data in them, but it wont pass through to the table.
  When I change the function to something simple like...</p>
  
  <pre><code>function createTable(code) 
      {
      return code;
      }
  </code></pre>
  
  <p>...it puts the correct data into the div and displays all the accordion tabs properly.  I cannot see the issue with the function.  The <code>document.ready {}</code> and the <code>createTable()</code> are both in the header, I have tried moving them to after the body and all other combinations.  I havent shown the <code>&lt;table&gt;&lt;tr&gt;&lt;th&gt;</code> opening and closing tags so as not to clutter up the code, but that is not the problem either as I have tried and tested it.</p>