javascript - javascriptがテーブルの値を表示しないhtml

Question

マウスをホバーすると小さなウィンドウがポップアップし、セルに表示されている値に関する情報が表示される JavaScript アプリケーションを作成しています。関数を以下に示します。ただし、ページをロードすると、マウスをセルの上に置いても何も表示されませんが、firebugのターミナルからその機能を実行すると、想定どおりに機能し始めます。なぜアイデアがなぜですか？

$(document).ready(function()
        {
            $('#mytable td').qtip({
                content : {
                    text : function(api){
                        return "Time spend: " + $(this).html();
                    }
                },
                position : {
                    my : 'top left',
                    target : 'mouse',
                    viewport : $(window),       //keep it on-screen at all time if possible
                    adjust : {
                        x : 10, y : 10
                    }
                },
                hide : {
                    fixed : true                // Helps to prevent the tooltip from hiding occassionaly when tracking!
                },
                style : 'ui-tooltip-shadow'
            });
        });

そしてHTML

<div id="mytable">
<table id="mytable" border="1px">
<tbody>
<tr>
<td style="background-color: rgb(0, 191, 255);">1</td>
<td style="background-color: rgb(0, 191, 255);">1</td>
<td style="background-color: rgb(0, 191, 255);">1</td>

これはテーブルのサンプルです。テーブル自体が巨大です (ヒートマップ)