JavascriptでAjaxレスポンスに要素を見つける

Question

私はいくつかの入力、chooseなどのフォームを持っています。結果にAjaxリクエストを送信してフォームに添付する連絡先を検索する「検索バー」を作成しました。

のindex.php - フォーム

<p><label for="q">Rechercher un contact</label> 
<input type="text" class="form-control" name="q" id="q" /> 
</p> 
<div id="results">Veuillez saisir un élément de recherche</div> 

のindex.php - アヤックス

$(document).ready(function() { 
    $('#q').keyup(function(){ 
     $field = $(this); 
     $('#results').html('Veuillez saisir un élément de recherche'); 
     $('#ajax-loader').remove(); 
     if($field.val().length > 2) { 
      $.ajax({ 
       type : 'GET', 
       url : 'contact.search.php', 
       data : 'q='+encodeURIComponent($(this).val()), 
       beforeSend : function() { 
        $field.after('<img src="assets/img/ajax-loader.gif" alt="loader" id="ajax-loader" />'); 
       }, 
       success : function(data) { 
        $('#ajax-loader').remove(); 
        $('#results').html(data); 
        console.log(data); 
       } 
      }); 
     }  
    }); 
}); 

ファイルcontact.search.phpは、要求を処理し、次の要素を持つテーブルをエコーし​​ます 表：<table id = contactResult> 結果TR：<tr class = select>

contact.search.php

while ($ligne = sqlsrv_fetch_object($query)) { 
    $body .= " 
      <tr class='select'> 
       <td class='item-nom'>".$ligne->nom."</td> 
       <td class='item-prenom'>".$ligne->prenom."</td> 
       <td class='item-tel'>".$ligne->tel."</td> 
       <td class='item-division'>".$ligne->division."</td> 
       <td class='item-direction'>".$ligne->direction."</td> 
      </tr>"; 
} 

そしてユーザが有していますTRのいずれかをクリックして必要な連絡先を選択するには、この選択がフォームを保存するために使用される他の入力に表示される必要があります。しかし、私はこのスクリプトを使用して、これらのデータをキャッチしようとすると：

Javascriptを

<script type="text/javascript"> 
    $("#contactResult tr").click(function(){ 
     var nom=$("td.item-nom"); 
     var prenom=$("td.item-prenom"); 
     var tel=$("td.item-tel"); 
     var division=$("td.item-division"); 
     var direction=$("td.item-direction"); 
     console.log(nom + "/" + prenom + "/" + tel + "/" + division + "/" + direction + "/"); 
     }); 
</script> 

コンソール「を見せて、[オブジェクトのオブジェクト]/[オブジェクトのオブジェクト]/[オブジェクトのオブジェクト]/[オブジェクトのオブジェクト]/

http://jsfiddle.net/65JPw/2/

しかし：[オブジェクトのオブジェクト] /「

私はこのヒントに従ってみましたAjaxのクエリによってコンテンツが読み込まれたときではなく、最初のページにデータがあるときのみ動作します。

誰かが私の働きを助けることができますか？そのtdのAjax結果表示データからコンソールにtrをクリックしたいと思います。ご協力いただきありがとうございます。

Answer 1

これを使用しないと、指定したすべてのクラスを参照しています。

$(document).on("click","#contactResult tr",function(){ 
     var nom=$(this).find("td.item-nom").html(); 
     var prenom=$(this).find("td.item-prenom").html(); 
     var tel=$(this).find("td.item-tel").html(); 
     v.ar division=$(this).find("td.item-division").html(); 
     var direction=$(this).find("td.item-direction").html(); 
     console.log(nom + "/" + prenom + "/" + tel + "/" + division + "/" + direction + "/"); 
     });