JSFiddle - React, Tailwind, and code Playground

HTML

<div id="contents">
	<div id="divForm">
		<form onsubmit="agregaFila(); return false;">
			<table>
				<tr>
					<td>iD: </td>
					<td><input type="text" id="inId"></td>
				</tr>
				<tr>
					<td>Apellido: </td>
					<td><input type="text" id="inApellido"></td>
				</tr>
				<tr>
					<td>Nombre: </td>
					<td><input type="text" id="inNombre"></td>
				</tr>
				<tr>
					<td colspan="2"><input type="submit" style="margin-left: 50px;" value="Enviar"> <input type="button" id="borrar" value="Borrar"></td>
				</tr>
			</table>
		</form>
	</div>
	<hr>
	<div id="divTabla">
		<table id="tablaDatos">
			<tr>
				<td>ID</td>
				<td>Apellido</td>
				<td>Nombre</td>
				<td>Examen 1</td>
				<td>Examen 2</td>
				<td>Examen 3</td>
				<td>Promedio</td>
			</tr>
		</table>
	</div>
</div>

CSS

* {
	font-family: "Calibri";
	font-size: 13px;
}

JavaScript

function agregaFila(){
    var refTabla=document.getElementById("tablaDatos");
    
    obj=new Object();
    obj.dato1=document.getElementById("inId").value;
    obj.dato2=document.getElementById("inApellido").value;
    obj.dato3=document.getElementById("inNombre").value;
    
    
    var nuevaFila=refTabla.insertRow(-1);
    var nuevaCelda;
    
    nuevaCelda=nuevaFila.insertCell(-1);
    nuevaCelda.setAttribute("class","id")
    nuevaCelda.innerHTML=obj.dato1;
    
    nuevaCelda=nuevaFila.insertCell(-1);
    nuevaCelda.setAttribute("class","apellido")
    nuevaCelda.innerHTML=obj.dato2;
    
    nuevaCelda=nuevaFila.insertCell(-1);
    nuevaCelda.setAttribute("class","nombre")
    nuevaCelda.innerHTML=obj.dato3;
    
    for(var i=0;i<3;i++){
        nuevaCelda=nuevaFila.insertCell(-1);
        nuevaCelda.setAttribute("class","nota")
        nuevaCelda.innerHTML="<input type='text' value='0' onblur='calculaPromedio(this)'>";
    }
        nuevaCelda=nuevaFila.insertCell(-1);
        nuevaCelda.setAttribute("class","nota")
        nuevaCelda.innerHTML="<span>0</span>";
}
 
 
function calculaPromedio(nodo){
    var nodoTd = nodo.parentNode; //Nodo TD
    var nodoTr = nodoTd.parentNode; //Nodo TR
    var celda = nodoTr.getElementsByTagName('td');
	var input = nodoTr.getElementsByTagName('input');
    
    var resultado = (parseInt(input[0].value) + parseInt(input[1].value) + parseInt(input[2].value)) / 3;
    celda[6].innerHTML="<span>"+resultado+"</span>";
    
}