JSFiddle - React, Tailwind, and code Playground

HTML

<div id="calculadora">
	<span id="numero1">NÚMERO 1</span>
	<input class="numero1input" id="numero1a" type="text" maxlength="6">
	<input id="calcular" type="button" value="CALCULAR">
</div>


<div id="respostas">
<div class="hr"></div>
<span class="nr" id="fatorar1">Fatorando o número 8 temos:</span>

<table id="table" class="tableborda">
<tr>
<td>
<span class="nr2" id="fat1">8</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fat2">4</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fat3">2</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fat4">1</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fat5">1</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fat6">1</span>
</td>
</tr>
</table>

<table id="table2" >
<tr>
<td>
<span class="nr2" id="fato1">2</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fato2">2</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fato3">2</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fato4">2</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fato5">2</span>
</td>
</tr>
<tr>
<td>
<span class="nr2" id="fato6">2</span>
</td>
</tr>
</table>

<div class="nr" id="nrr"><span class="nrgrande">Então: 8 = 2</span><span class="nrpequeno">3</span></div>

CSS

#table, #table2 {
margin-left: 70px;
margin-top: 20px;
margin-bottom: 20px;
float: left;
font-family: verdana;
font-size: 12px;
color: #000;
text-align: right;
}

#table2 {
margin-left: 1px;
text-align: left;
}

.tableborda {
border-right: 2px solid #000;
}


#nrs {
float: left;
}

.nrpequeno {
margin-top: -6px;
float: left;
font-family: verdana;
font-size: 10px;
color: #000;
margin-left: 1px;
margin-right: 1px;
}


.nrgrande {
margin-top: 0px;
float: left;
font-family: verdana;
font-size: 14px;
color: #000;
}

.nrpequeno2 {
margin-top: -6px;
float: left;
font-family: verdana;
font-size: 10px;
color: #FFF;
margin-left: 1px;
margin-right: 1px;
}


.nrgrande2{
margin-top: 0px;
float: left;
font-family: verdana;
font-size: 14px;
color: #FFF;
}

.resultado {
margin-left: 18px;
margin-top: 10px;
float: left;
font-family: verdana;
font-size: 14px;
color: #FFF;
width: 92%;
text-align: left;
background-color: #C1272D;
width: 760px;
height: 15px;
padding-top: 8px;
padding-bottom: 8px;
padding-left: 10px; 
padding-right: 10px;
}

.nrgranderesultado{
margin-left: 5px;
margin-top: -5px;
float: left;
font-family: verdana;
font-size: 22px;
color: #FCEE21;
}

JavaScript

$("#calcular").click(function() {
Calcular();
});

function Calcular() {
        m = $("#numero1a").val();
	
		
		$("#fatorar1").html("Fatorando o número " + m + " temos:");


		var mres2 = 0;
		var mres3 = 0;
		var mres5 = 0;
		var mres7 = 0;
		var mres13 = 0;
		var mres11 = 0;
		var mres1 = 0;
		
if (m % 2 == 0)
{
$("#fat1").html(m);
$("#fato1").html("2");
var m2 = m / 2;
mres2++;
}
else if (m % 3 == 0)
{
$("#fat1").html(m);
$("#fato1").html("3");
var m2 = m / 3;
mres3++;
}
else if (m % 5 == 0)
{
$("#fat1").html(m);
$("#fato1").html("5");
var m2 = m / 5;
mres5++;
}
else if (m % 7 == 0)
{
$("#fat1").html(m);
$("#fato1").html("7");
var m2 = m / 7;
mres7++;
}
else if (m % 13 == 0)
{
$("#fat1").html(m);
$("#fato1").html("13");
var m2 = m / 13;
mres13++;
}
else if (m % 11 == 0)
{
$("#fat1").html(m);
$("#fato1").html("11");
var m2 = m / 11;
mres11++;
}
else if (m % 1 == 0)
{
$("#fat1").html(m);
$("#fato1").html("1");
var m2 = m / 1;
mres1++;
}



if (m2 == 1 && m != 1)
{
$("#fat2").html("1");
$("#fato2").html("");
var m3 = 1;
}
else if (m2 == 1 && m == 1)
{
$("#fat2").html("");
$("#fato2").html("");
var m3 = 1;
}
else {

if (m2 % 2 == 0)
{
$("#fat2").html(m2);
$("#fato2").html("2");
var m3 = m2 / 2;
mres2++;
}
else if (m2 % 3 == 0)
{
$("#fat2").html(m2);
$("#fato2").html("3");
var m3 = m2 / 3;
mres3++;
}
else if (m2 % 5 == 0)
{
$("#fat2").html(m2);
$("#fato2").html("5");
var m3 = m2 / 5;
mres5++;
}
else if (m2 % 7 == 0)
{
$("#fat2").html(m2);
$("#fato2").html("7");
var m3 = m2 / 7;
mres7++;
}
else if (m2 % 13 == 0)
{
$("#fat2").html(m2);
$("#fato2").html("13");
var m3 = m2 / 13;
mres13++;
}
else if (m2 % 11 == 0)
{
$("#fat2").html(m2);
$("#fato2").html("11");
var m3 = m2 / 11;
mres11++;
}
else if (m2 % 1 == 0)
{
$("#fat2").html(m2);
$("#fato2").html("1");
var m3 = m2 / 1;
mres1++;
}

}


if (m3 == 1 && m2 != 1)
{
$("#fat3").html("1");
$("#fato3").html("");
var m4 = 1;
}
else if (m3 == 1 && m2 == 1)
{
$("#fat3").html("");
$("#fato3").html("");
var m4 = 1;
}
else {

if...