Jquery selecciona tbody pero no de tablas anidadas - javascript, jquery, backbone.js

Estoy tratando de añadir datos a una tabla, que obtieneseleccionado utilizando jquery. El problema es que esta tabla puede tener tablas anidadas dentro de ella. Lo que sucede es que cuando agrego los datos, no solo se anexa el cuerpo de la tabla principal, sino también el resto de las tablas secundarias. Aquí está mi código:

var template = window.app.getTemplate("myTemplate");
var image = {id: imageId, name: imageName, imageList: imageTypes, extension: ext, thumbNail: thumbNailPath};
$("#MyTable tbody:first").append(template(image));

Donde myTemplate está configurado de esta manera:

<tr>
<td>
<table>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
</td>
<tr>
</tr>
<td></td>
</tr>

y MyTable se configura así:

<table id="MyTable" data-attr="images">
<thead>
</thead>
<tbody>
</tbody>
</table>

Como dije, cuando ocurre el apéndice, si hay más de una tabla dentro de tbody, se anexan todos a tbody. Entonces, ¿cómo selecciono solo la primera?

Gracias

Respuestas

JQuery usa los selectores de CSS para alcanzar el elemento.

$("#MyTable > tbody:first")

E> F Coincide con cualquier elemento F que sea un hijo de un elemento E.

Ver más en http://www.w3.org/TR/CSS2/selector.html#child-selectors

Tal vez si actualizas tu selector de jquery.

$("#MyTable > tbody:first")

Tratar:

$("#MyTable > tbody").append(template(image));