jquery - json で生成されたテーブルでチェックされた入力の値にアクセスする

Question

getJSON ajax 呼び出しによって生成されたテーブルがあり、チェックされた値をループして収集し、データベースに入れたいと考えています。

テーブルは次のようになります。

<div class="content">
<table>
<tr> <td> etc. </td> </tr>
</table>
</div>

コンテンツ div は存在しますが、テーブル、行、およびセルは ajax スクリプトによって作成されるため、次のようになります。

$.each( data, function( key, value ) {
        var txt =  '<tr>';
            txt += '<td style=\"background:#E3F6CE;\"><input type=\"checkbox\" class=\"case\" value=\"' + this["id"] + '\">';
            txt += '<td><a href=\"/edit/' + this["id"] + '\">'+ this["first"] + ' ' + this["last"]  + '</a></td>';
            txt += '<td>' + this["designation"] + '</td>';
        txt += '<td>' + this["company"] + '</td>';
            txt += '<td>' + this["email"] + '</td>';
            txt += '<td>' + this["remarks"] + '</td>';
        txt += '</tr>';
            $('.content').append(txt);
        });

これまでのところ、問題はありません。テーブルは正常にレンダリングされます。

さて、次のとおりです。

$(document).ready(function() {
 $(".content").on( "input:checked" ).each(function() {
     //var id = $(this).val();
        var id = $( "input:checked" ).val();
              alert(id);
  });
});

1 つの ID のみを取得するため、複数のチェックボックスがオンになっている場合、すべてではなく 1 つだけが取得されます。

何がうまくいかないのですか？

前もって感謝します。