Esto no es demasiado difícil. La forma más sencilla sería agregar a través de .append:
$( '#table > tbody:last').append('<tr id="id"><td>stuff</td></tr>');
Agregar elementos en tiempo real no es del todo posible. Tendría que ejecutar una consulta Ajax que se actualice en un bucle para "atrapar" el cambio. Entonces, no totalmente en tiempo real, pero muy, muy cerca de eso. Tu usuario realmente no notaría la diferencia, aunque la carga de tu servidor sí.
Pero si va a involucrarse más, le sugiero que consulte DataTables . Le brinda bastantes características nuevas, que incluyen clasificación, paginación, filtrado, limitación, búsqueda y carga ajax. A partir de ahí, puede agregar un elemento a través de ajax y actualizar la vista de la tabla, o simplemente agregarlo a través de su API. He estado usando DataTables en mi aplicación desde hace algún tiempo y se los ha citado constantemente como la característica número 1 que hace que la inmensa cantidad de datos sea utilizable.
--Editar --
Debido a que no es obvio, para actualizar el DataTable al que llama, configure su llamada de Datatables a una variable:
var oTable = $('#selector').dataTable();
Luego ejecute esto para hacer la actualización:
oTable.fnDraw(false);
ACTUALIZACIÓN:5 años después, febrero de 2016:esto es mucho más posible hoy que en 2011. Los nuevos marcos de Javascript, como Backbone.js, pueden conectarse directamente a la base de datos y desencadenar cambios en los elementos de la interfaz de usuario, incluidas las tablas sobre cambios, actualizaciones o eliminación de datos... es uno de los principales beneficios de este marco. Además, las interfaces de usuario pueden recibir actualizaciones en tiempo real a través de conexiones de socket a un servicio web, que también se pueden capturar y actuar en consecuencia. Si bien la técnica descrita aquí todavía funciona, hoy en día hay muchas más formas "vivas" de hacer las cosas.
