Chodzi mi o coś takiego ...
let button = document.getElementById('z_sumuj');
button.addEventListener('click',sum());
function sum () {
...
}
Niestety nie działa. Nie widzi dodanych +. Node list 3 zamiast 5 które są w Inspektorze.

Sprawdź coś takiego jak Event Delegation
sprawdź taki zapis
[ kod on-line ]
<table>
<thead>
<tr>
<td><button id="add-subrows">+</button></td>
</tr>
</thead>
<tbody>
<tr class="subrows">
<td>
<input type="number" value="1"><button>-</button>
</td>
</tr>
<tr class="subrows">
<td>
<input type="number" value="2"><button>-</button>
</td>
</tr>
<tr class="subrows">
<td>
<input type="number" value="3"><button>-</button>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>
<button id="sum-all">Dodaj wszystkie</button>
<span id="sum-all-result"></span>
</td>
</tr>
</tfoot>
</table>
const container = document.querySelector('table');
container.addEventListener('click', sumAll);
container.addEventListener('keydown', (e) => e.preventDefault());
function sumAll(e) {
const element = e.target;
if (element.matches('#add-subrows')) {
const row = '<tr class="subrows"><td><input type="number" value="0"><button>-</button></td></tr>';
container.querySelector('tbody').insertAdjacentHTML('beforeend', row);
}
if (element.matches('button') && element.textContent == '-') {
element.closest('tr').remove();
container.querySelector('#sum-all').click();
}
if (element.matches('input')) container.querySelector('#sum-all').click();
if (element.matches('#sum-all')) {
const subrows = [...container.querySelectorAll('tbody input')];
const result = container.querySelector('#sum-all-result');
if (subrows.length > 0)
result.textContent = subrows.reduce((total, current) => total + (+current.value), 0);
else
result.textContent = 0;
}
}