Why is my input incrementing by more than one from this jQuery statement?

Question

My code below is currently cloning a row from a table to another table on click of table row. Once that happens I'm appending an increment and decrement button and a input text value to the end of the row (The input value changes upon click of increment and decrement button). This works perfectly if there is only one row, but once there are more than one my buttons will increment or decrement based on how many rows are attached to table. Why is this happening?

"initComplete": function() {
  $("#itemsAvaliableList tr").on("click", function() {
    var items = [];
    $("#item-table tbody tr[id='no-item-row']").hide();
    $("#backToList").hide();
    $("#acceptButton").show();
    var newTr = $(this).closest("tr").clone();
    // Increment button that goes next to added items in Screen Entry
    var newIncrementButton = "<td class='incrementButtons' style='white-space: nowrap'><input class='qty' size='5' type='text' value='1' name='Quantity' onkeypress='return isNumberKey(event)'/><button class='ml-3 btn btn-danger qtyminus' display= 'inline-block;' id='valueChange'>-</button> <button id='valueChange' class='qtyplus btn btn-success'>+</button></td>"
    items.push(newTr);
    newTr.appendTo($("#item-table tbody"));
    $(newTr).append(newIncrementButton);

    $('.qtyplus').on('click', function(e) {
      e.preventDefault();
      var num = Number($(this).siblings('.qty').val());
      $(this).siblings('.qty').val(++num);
    });

    $('.qtyminus').on('click', function(e) {
      e.preventDefault();
      var num = Number($(this).siblings('.qty').val());
      $(this).siblings('.qty').val(--num);
    });

  });
}