After adding row cell in table not converted to textbox issue

After adding row cell in table not converted to textbox issue

Hi I need after i add row convert all cell found in row converted to text box
in code below i can add row success but i cannot converted all celles in row to text box
i try to make row added as text box but not got
my code as below

  1. @{
  2.     Layout = null;
  3. }

  5. <!DOCTYPE html>

  7. <html>
  8. <head>
  9.     <meta name="viewport" content="width=device-width" />
  10.     <title>Index</title>
  11.     <script src="~/Scripts/jquery-1.10.2.js"></script>
  12.     <script>
  13.         $(function () {
  14.             $("#btn").click(function () {
  15.                 var x = $("#txt1").val();
  16.                 var y = $("#txt2").val();
  17.                 var z = $("#txt3").val();
  18.                 var M = $("#txt4").val();
  19.                 $("#tb").append("<tr> <td>" + x + "</td> <td>" + y + "</td> <td>" + z + "<td>" + M + "</td></tr>");
  20.                
  21.             });
  22.             $("#tb").on("click", ".d", function () {
  23.                 var row = $(this).closest('tr').toggleClass("editing");
  24.                 row.find("td").slice(0, 3).prop("contenteditable", true);
  25.             });

  27.         });
  28.     </script>
  29.     <style>
  30.         .editing {
  31.             background: yellow;
  32.         }
  33.     </style>
  34. </head>
  35. <body>
  36.     <div>
  37.         Name<input type="text" id="txt1" /><br />
  38.         Salary<input type="text" id="txt2" /><br />
  39.         Bonus<input type="text" id="txt3" /><br />
  40.         Deduction<input type="text" id="txt4" /><br />
  41.         <input type="button" value="add" id="btn" />
  42.        

  44.         <table>
  45.             <thead>
  46.                 <tr>
  47.                     <td>
  48.                         Name
  49.                     </td>
  50.                     <td>
  51.                         Salary
  52.                     </td>
  53.                     <td>
  54.                         Bonus
  55.                     </td>
  56.                     <td>
  57.                         Deduction
  58.                     </td>
  59.                 </tr>
  60.             </thead>
  61.             <tbody id="tb" class="d"></tbody>
  62.         </table>
  63.     </div>
  64. </body>
  65. </html>