Well... I don't know why you're wrapping your buttons in anchor tags, nor the inline styles, but they don't help as far as this is concerned - anyway this works for me:
<style type="text/css">
table input{
display: none;
}
table tr:hover input{
display: block;
}
</style>
<table>
<tr>
<td class="tg-98kr">Libby Folfax</td>
<td class="tg-98kr">folfax2014@example.com</td>
<td class="tg-98kr">City</td>
<td class="tg-98kr">Sometimes</td>
<td class="tg-98kr">Mon, Tue, Wed</td>
<td class="tg-98kr">13/08/2018 11:29AM</td>
<td class="tg-98kr"><input type="button" onclick="deleteRow(this)" class="w3-button" value="delete" /></td>
</tr>
<tr>
<td class="tg-q3hw">Nick Dean</td>
<td class="tg-q3hw">nickd@example.com</td>
<td class="tg-q3hw">City</td>
<td class="tg-q3hw">Always</td>
<td class="tg-q3hw">Fri, Sat</td>
<td class="tg-q3hw">13/08/2013 11:29AM</td>
<td class="tg-q3hw"><input type="button" onclick="deleteRow(this)" class="w3-button" value="delete" /></td>
</tr>
</table>
<script type="text/javascript">
function deleteRow(btn) {
var row = btn.parentNode.parentNode;
row.parentNode.removeChild(row);
}
</script>