html - Append/add a <div> tag inside a table row when row button is clicked jquery/php

one text

Solution:

I believe it is a scope issue. $(this) no longer refers to the same thing inside the $.ajax() functions.

Try this:

//Start of 1st script
var $this = $(this);  <=================== added this line, and modded one 30 below
$.ajax({
  url: "ajax.php",
  type: "POST",
  success: function(data) {
    //alert("File 1 Completed")

    $("#progress-text").text("Executing file 1");
    $('#progBar').val(25);

    //Start of 2nd script
    $.ajax({
      url: "ajax2.php",
      type: "POST",
      success: function(data2) {
        //alert("File 2 Completed")
        $("#progress-text").text("Executing file 2");
        $('#progBar').val(50);

        //Start of 3rd script
        $.ajax({
          url: "ajax3.php",
          type: "POST",
          success: function(data3) {
            //alert("File 2 Completed")
            $("#progress-text").text("Complete");
            $('#progBar').val(100);

            vv <=================================== modded $(this) to $this
            $this.closest("tr").find("td:nth-child(8)").load("pdf_report.php");

          }
        })
      }
    })
  }
})

Source