JS - Calculo não mostra resultado

[luskka1 0]

esse é onde o cara digita as informações

<div class="col-6">

<div>

<font color="white"><h2>Digite seu NICK:</h2> </font>

<input type="text" class="div1" id="nick" name="nick" size="50%" maxlength="50%"/>

<font color="white"><h2>Seu elow:(bronze, prata, ouro, diamante, mestre, challenger)</h2> </font>

<input type="text" class="div1" id="elow" name="elow" size="50%" maxlength="50%"/>

<font color="white"><h2>Total de vitórias:</h2> </font>

<input type="text" class="div1" id="vito" name="vito" size="50%" maxlength="50%"/>

<font color="white"><h2>Total de derrotas:</h2> </font>

<input type="text" class="div1" id="der" name="der" size="50%" maxlength="50%"/>

</br>

</br>

<button onclick="mmr()"> <img src="image/button.png"> </button>

</br>

<font color="#00cbdd"><h2> Seu MRR:</h2> </font>

<p><span id id="resultado" name="resultado"></span></p>

</div>

</div>

Esse é o JS não sei o que estou fazendo de errado...

<script type="text/javascript">

function mmr(){

var nick = (document.getElementById("nick").value;

var elow = (document.getElementById("elow").value;

var vito = parseInt(document.getElementById("vito").value);

var der = parseInt(document.getElementById("der").value);

var elowfinal = 0;

var calc;

var result = " ";

switch(elow){

case "bronze": elowfinal = 400;

break;

case "prata": elowfinal = 700;

break;

case "ouro": elowfinal = 1000;

break;

case "platina": elowfinal = 1300;

break;

case "diamante": elowfinal = 1650;

break;

case "Mestre": elowfinal = 2000;

break;

case "challenger": elowfinal = 2400;

break;

}

calc = (vito-der)*2;

calc = calc + elowfinal;

reult = nick + "Seu MMR é:" + calc;

document.getElementById("resultado").innerHTML = result;

}

</script>

[andreneeto 7]

Cara, procura utilizar o console para debug do seu script, possui vários erros mais são coisas simples. Segue solucao:

<div class="col-6">
	<div>
		<font color="white">
			<h2>Digite seu NICK:</h2>
		</font>
		<input type="text" class="div1" id="nick" name="nick" size="50%" maxlength="50%"/>

		<font color="white">
			<h2>Seu elow:(bronze, prata, ouro, diamante, mestre, challenger)</h2>
		</font>
		<input type="text" class="div1" id="elow" name="elow" size="50%" maxlength="50%"/>

		<font color="white">
			<h2>Total de vitórias:</h2>
		</font>
		<input type="text" class="div1" id="vito" name="vito" size="50%" maxlength="50%"/>

		<font color="white">
			<h2>Total de derrotas:</h2>
		</font>
		<input type="text" class="div1" id="der" name="der" size="50%" maxlength="50%"/>

		<br><br>

		<button onclick="mmr()"> <img src="image/button.png"></button>

		<br>

		<font color="#00cbdd">
			<h2>Seu MRR:</h2>
		</font>
		<p>
			<span id="resultado" name="resultado"></span>
		</p>
	</div>
</div>

	function mmr() {
		var nick = document.getElementById("nick").value;
		var elow = document.getElementById("elow").value;
		var vito = parseInt(document.getElementById("vito").value);
		var der = parseInt(document.getElementById("der").value);

		var calc;
		var elowfinal = 0;

		switch(elow) {
			case "bronze":
				elowfinal = 400;
			break;
			case "prata":
				elowfinal = 700;
			break;
			case "ouro":
				elowfinal = 1000;
			break;
			case "platina":
				elowfinal = 1300;
			break;
			case "diamante":
				elowfinal = 1650;
			break;
			case "Mestre":
				elowfinal = 2000;
			break;
			case "challenger":
				elowfinal = 2400;
			break;
		}

		calc = (((vito - der) * 2) + elowfinal);

		document.getElementById("resultado").innerHTML = (nick + " Seu MMR é: " + calc);
	}