Estilizar Tabla generada dinámicamente con Jquery apartir de datos recibidos via JSON

[juan_caz]

Hola!

Estoy haciendo un script en Jquery que hace una busqueda a una base de datos llamando a un archivo PHP de forma asíncrona y el script en PHP regresa los datos con formato JSON, al recibir los datos creo una tabla y la voy anexando a un DIV y despues muestro este DIV que se encontraba oculto y todo funciona muy bien pero el problema es que la tabla no se muestra con el estilo CSS... se muestra sin ningun estilo, supongo que es porque el navegador aún no ha renderizado esa tabla debido a que la estoy creando de forma asíncrona.

Intenté con el método .addClass de Jquery pero tampoco funciona... el método funciona bien, es decir, le agrega la clase pero el navegador la sigue mostrando sin estilo...

Estuve buscando alguna solución pero no encontre, alguién sabe de algún método para que se muestre esta tabla estilizada sin recargar la página??

Espero haberme explicado y gracias de antemano!

Juan Carlos

[juan_caz]

Hola de Nuevo!

Ya resolví mi problema!!

Lo que pasa que estaba creando la tabla con el método append de Jquery pero al inspeccionar la tabla creada mediante el firebug observé que los tags de la tabla se cerraban automáticamente al ser anexados.. es decir, la salida era algo asi como:

Código HTML:

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

Lo cual no es deseado debido a que voy anexando td de acuerdo al contenido de la respuesta, lo que hacía previamente era:

Código:

$('#ResultadosBusqueda').append('<table><tr>');
$('#ResultadosBusqueda').append('<th>Nombre</th>');
$('#ResultadosBusqueda').append('</tr>');
$('#ResultadosBusqueda').append('<tr>');
$('#ResultadosBusqueda').append('<td>datos.nombre</td>');
$('#ResultadosBusqueda').append('</tr></table>');

Nota: El código de arriba esta un poco simplificado para cuestiones práctivas y no representa la forma real pero es para que se den la idea y quizas le sirva a alguien en el futuro.

La solución fue en vez de hacer el append uno por uno a la capa DIV, fuí concatenando el valor a una varible llamada "tabla" y una vez concatenado todo el contenido ahora si la agregamos al div con el método append el valor de la variable "tabla", algo asi:

Código:

var tabla = '<table class="listado">'
		+ '<tr>'
		+ '<th>Nombre</th>'
                + '</tr>';
		+ '<tr>'
		+ '<td>datos.nombre</td>'
                + '</tr>';
                + '</table>';

$('#ResultadosBusqueda').append(tabla);

Y con esto la tabla se mostró correctamente y por lo tanto el estilo que era lo que quería, saludos!