Jquery UI accordion Does not properly work dynamically

Jquery UI accordion Does not properly work dynamically

This is the code
hear the Accordion correct format

Using this code the accordion not work properly
<div>
<div id="accordion">
<div th:each="pattern : ${patterns}">
<h4><p th:text="${pattern.questionPattern}"/></h4>
/*if the pattern the </div> close hear the accordion not
work properly */
<div>
<table>
<tr th:each="q : ${questions}">
<div th:if="${q.questionPattern.id ==pattern.id }">
<p>
<input type="checkbox" class="ads_Checkbox"
th:text="${q.questionName}" id="checkBoxId"
onclick="validate()"
th:onclick="'javascript:Select(\'' + ${q.id} + '\',this);'"
name="checkbox" /><img border="0"
th:attr="src=@{${q.imagePath}} ,
title=#{background}, alt=#{background}"
style="width: 50px; height: 50px;" /></p>
</div>
</tr>
</table>
</div>
</div>
</div>
</div>
the out put is not the right format.
how to get the correct format..?