Dynamically adding new row in html table

You need to unbind the keyup from the td's that you don't want to have a keylistener registered. This snippet will take your addNewRow() and set a previousLastTable that will be unbound with previousLastTable.off("keyup"); that will remove the listener. The the only active listener will be the last td of the last tr

$(function() {
  // Change the selector if needed
  var $table = $('.mt-table-edit');

  addNewRow();

  var previousLastTable;


  function addNewRow() {
    //get row template. We must use html() for new instance other event handler will get attached to last row
    var $tr = $("<tr><td><input/></td><td><input/></td><td><input/></td><td><input/></td></tr>");

    if (previousLastTable) {
      previousLastTable.off("keyup");
    }


    $tr.find("td").eq($tr.find("td").length - 1).keyup(function(e) {
      if (event.keyCode === 13) {
        addNewRow();
      }
    });

    // add template after the last row
    $table.find("tbody:last-child").append($tr);

    // focus on firt input of newly added row
    $tr.find("td:first input").focus();

    previousLastTable = $tr.find("td").eq($tr.find("td").length - 1);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p>
  To add new row press enter key in the last cell of the row
</p>
<table class="mt-table-edit">
  <thead>
    <tr>
      <th>Street</th>
      <th>State</th>
      <th>City</th>
      <th>Country</th>
    </tr>
  </thead>
  <tbody>

  </tbody>
</table>

You are hooking up a keyup() handler to the last cell of the row every time a new row is added. Instead give the last cell a class and bind the addnewrow to that class. then before adding the row first remove class from all existing cells then add your row. This way only the last cell of the last row will have the class that triggers add new row.

$(function() {
  // Change the selector if needed
  var $table = $('.mt-table-edit');

  addNewRow();


  function addNewRow() {
    //get row template. We must use html() for new instance other event handler will get attached to last row
    var $tr = $("<tr><td><input/></td><td><input/></td><td><input/></td><td><input class='addNew' /></td></tr>");


    // add template after the last row
    $table.find("tbody:last-child").append($tr);

    // focus on firt input of newly added row
    $tr.find("td:first input").focus();
  }

  $table.on('keyup', '.addNew', function(e){    
    if (event.keyCode === 13) {
        $(this).removeClass('addNew');
        addNewRow();
      }
  });
});

Here is the updated/working fiddle

Both answers by @Nils Kähler and @Nawed Khan may work based on my initial post. However, each row also has delete option. User can delete any row. My javascript does take care of deleting individual row. (Sorry i omitted that part for brevity purpose. my mistake). That means for me the solution would not work as it is.( However i up-voted you since it was correct answer for initial post)

I just needed the easiest way to find if the current row is the last row of the table. so here is my working demo.

     if (e.keyCode === 13 && $(this).closest("tr").is(":last-child")) {
            addNewRow();
     }

DEMO