jquery - 非表示の sibling-div のコンテンツをボタンに取得する方法 - JQuery 関連

Question

検索が不十分だったのかもしれませんが、これまでのところ、私の質問に対する答えは見つかりませんでした。まず、Javascript 関数のコード:

<script>
    function showComment(){
        var $data = $(this).parent("td").contents("div.hiddenComment").text();
        console.log($data);
        alert($data);
        return false;
    }
</script>

私が取り組んでいる HTML コードも以下に含めました。基本的には<table>であり、1 つ<td>に<button>と 非表示の があり<div>ます。の内容は<div>、アラート/ダイアログ ボックスに表示する必要があります。

<table class="center">
      <thead>
          <tr>
             <th>Status</th>
             <th>Datum</th>
             <th>Zeit</th>
             <th>Amount</th>
             <th>Source</th>
             <th colspan="2">Comment</th>
          </tr>
       </thead>
       <tbody>
           <tr>
             <td>status1</td>
             <td>2013-04-04</td>
             <td>06:30:38</td>
             <td>3.646.268,00</td>
             <td>SRC1</td>
             <td>
                <div class="hiddenComment">a comment</div>
                <button name="showComment" type="button" href="#" class="showComment" onClick="showComment()">show</button>
             </td>
             <td><a href="#" class="addComment">add</a>
             </td>
          </tr>
          <tr>
             <td>status</td>
             <td>2013-04-05</td>
             <td>06:30:48</td>
             <td>1.732.213,00</td>
             <td>SRC2</td>
             <td>
                <div class="hiddenComment">an other comment</div>
                <button name="showComment" type="button" href="#" class="showComment" onClick="showComment()">show</button>
             </td>
             <td><a href="#" class="addComment">add</a>
             </td>
          </tr>
          .....
      </body>
</table>

<table>このコードからについてのアイデアを得ることができると思います。とにかく、ウェブを検索して今までに達成した最高のものは"undefined"メッセージでした.

注意すべきこと: クラス.hiddenCommentには CSS プロパティがありますdisplay:none。

ヒント、ヒント、トリックは大歓迎です！

お時間をいただきありがとうございます。