关于outerHTML的赋值问题；

做动态表格时，想用outerHTML直接生成代码，于是写了如下内容：

 $.ajax({
            type:"post",
            url:"getData.php",
            dataType:"json",    
            success: function(msg)
            {           
             for(var i = 0; i < (msg.length)/4; i++)
               {
            //赋值
            $("#tableBody")[0].outerHTML='<tr class="logDataRow">'+
                                            '<td>'+ msg[4*i]+'</td>'+
                                            '<td>'+msg[4*i+1] +'</td>'+
                                            '<td>'+msg[4*i+2] +":"+msg [4*i+3] +'</td></tr>';
            //直接打印      
            console.log($("#tableBody")[0].outerHTML);      
                };   
            },
            error : function(){alert("error!");}

            })

        在firefox环境下可以直接打印出表格结构，赋值却会报错
        TypeError: $(...)[0] is undefined
        百思不得其解，求各位大神指教，初学，求别骂