IDを持つ動的に作成されたボタンが機能しない

Question

ページの最初のボタンlogoffをクリックした後に作成されるボタンがあります。次に、IDがreseteliteの新しいボタンを表示します。このボタンをクリックしても何も起こらず、機能が表示されません。

... 
     <dt> 
      <br /> 

      <input type="submit" value="Log Off" class="btn btn-default" id="logoff" /> 
     </dt> 
    </dl> 
</div> 
<div> 
    <br /> 
    <table class="table" style="white-space: nowrap" id="results"> 

    </table> 
</div> 
<br /> 
<div id="button"> 

</div> 
<p> 
    @Html.ActionLink("Back to List", "Index") 
</p> 
<script> 
    $('#logoff').click(function (event) { 
     var SessionId = $('#SessionId').val(); 
     var ServerName = $('#ServerName').val(); 
     var AppName = $('#AppName').val(); 
     $(this).remove(); 
     lookfor = JSON.parse('{ "sessionid":"' + SessionId + '","servername":"' + ServerName + '" }'); 
     $.ajax({ 
      type: "POST", 
      url: "/Home/LogOffSession", 
      data: lookfor, 
     }).done(function (data) { 
      var html = "Logoff Failed" 
      var err = "<tr><td>" + data.ErrorMessage + "</td></tr>" 
      var btn = "<input type=\"submit\" value=\"Reset Profile\" class=\"btn btn-default\" id=\"resetelite\" />" 

      if (err.length > 0) { 
       $('#results').append($(err)); 

       $('#button').append($(btn)); 
      } else { 
       $('#results').append($(html)); 
      } 
     }); 
    }); 

    $(document).ready(function() { 
     $(document).on("click", "resetelite", function (event) { 
      var UserId = $('#UserId').val(); 
      $(this).remove(); 
      lookfor = JSON.parse('{ "username":"' + UserId + '" }'); 
      $.ajax({ 
       type: "POST", 
       url: "/Home/ResetElite", 
       data: lookfor, 
      }).done(function (data) { 
       var html = "<tr><td>" + data.Result + "</td></tr>" 
       $('#results').html(""); 
       $('#results').append($(html)); 

      }); 
     }); 
    }); 

</script> 

Answer 1

.on("click", "resetelite",が間違っている：私は、私はこの権利をしたかわからない場合は、イベントハンドラを再接続する.onを使用しました。 .on("click", "#resetelite",

あなたはイベントの委任を正しく使用していますが（hooray！）、IDで選択する必要があるのは#です。