title: how to refresh one row without reloading full page in jquery and ajax while performing insertion\deletion\edit
body: <p>My jquery code is</p>
  
  <pre><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      $(document).ready(function () {           
          $("#body").on("click", ".button", function () {
              var name = $("#name").val();
              var lname = $("#lname").val();
              var email = $("#email").val();
              var mob = $("#mob").val();
  
              $.ajax({
                  url: "add.jsp",
                  type: "post",
                  data: {
                      name: name,
                      lname: lname,
                      email: email,
                      mob: mob,
                      id: i,
                      update: isUpdating ? 1 : 2,
                  },
                  success: function (data) {
                      isUpdating = false;
                      location.reload();                   
                      get(data);
                  }
              })
          });
          function get() {
              $.ajax({
                  url: "select.jsp",
                  type: "post",
                  datatype:"json",
                  success: function (data) {
                      var obj = JSON.parse(data);
                      for(var i=0;i&lt;obj.length;i++){
                          $("#tbody").append("&lt;tr&gt;&lt;td&gt;" + obj[i].id + "&lt;/td&gt;&lt;td&gt;" + obj[i].name + "&lt;/td&gt;&lt;td&gt;" + obj[i].lname + "&lt;/td&gt;&lt;td&gt;" + obj[i].email + "&lt;/td&gt;&lt;td&gt;" + obj[i].mob + "&lt;/td&gt;&lt;td&gt;" + '&lt;input type="button" class="edit" value="edit"&gt;' + "&lt;/td&gt;&lt;td&gt;" + '&lt;input type="button" class="delete" value="delete"&gt;'+ "&lt;/td&gt;&lt;/tr&gt;");
                       }
                   }
               })
           }
           get();
       });
   &lt;/script&gt;
  </code></pre>
  
  <p>The code above will refresh the page completely because here I am using <code>location.reload();</code>. Help me to update only the selected rows while performing insertion or deletion or editing.</p>
  
  <p>My html code is as follows</p>
  
  <pre><code>&lt;body&gt;
    &lt;table border="1" style="background-color:  #c1c0c0;margin-left: 500px;"&gt;
      &lt;tbody id="tbody"&gt;
        &lt;tr&gt;
          &lt;th&gt;ID&lt;/th&gt;
          &lt;th&gt;NAME&lt;/th&gt;
          &lt;th&gt;last name&lt;/th&gt;
          &lt;th&gt;email&lt;/th&gt;
          &lt;th&gt;mobile&lt;/th&gt;
        &lt;/tr&gt;
      &lt;/tbody&gt;
    &lt;/table&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>the html code also contains a form submit page above the table body</p>