$(document).ready( function() { $("#butt").on("click", function() { var a = $("#input1").val().split(""); var b = $("#input2").val().split(""); var prod = parseInt(a.join(""))*parseInt(b.join("")); var width = prod.toString().length; var height = 6 + b.length var w = prod.toString().length; var n1 = a.length; var n2 = b.length; var table = $('

'); //creating the table for(var i=0; i "); table.append(row); if(i == 3 || i == height-2) { var cols = $('

'); row.append(cols); } else{ for(var j=0; j "); row.append(cols); } } } $("#total").append(table); if(n2 < 2) { $("tr").eq(height-1).remove(); $("tr").eq(height-2).remove(); } $("tr").eq(0).addClass("carry"); // putting the numbers for(var i=1; i<3; i++) { if(i == 1) { for(var j=0; j 0 ) { $("tr").eq(2).children().eq(width-i).removeClass('red'); } if(j > 0) { $("tr").eq(1).children().eq(width-j).removeClass('red'); } $("tr").eq(1).children().eq(width-1-j).addClass('red'); $("tr").eq(2).children().eq(width-1-i).addClass('red'); var x = parseInt(b[n2-1-i]) * parseInt(a[n1-1-j]); var x2 = (x + carry); if(x2>9) { temp = x2.toString().split(""); add = parseInt(temp[0]); x = parseInt(temp[1]); $("tr").eq(0).children().eq(width-2-j).text(add); carry = 0; } $("tr").eq(4+i).children().eq(width-1-j-i).text(x + carry); //.css("background","blue"); if(x2 < 10) { add = 0; } carry = add; j++; if(j == n1) { if(add > 0) { $("tr").eq(4+i).children().eq(width-1-j-i).text(add); } j = 0; $("tr").eq(0).children().text(""); carry = 0; add = 0; i++; } },500) function final() { carry = 0; add = 0; var sum = 0; var i=0 $("tr").eq(1).children().eq(w-1).addClass('green'); var setInt2 = setInterval( function() { if(i >= width) { $("tr").eq(height-3).children().eq(0).removeClass('red'); clearInterval(setInt2); return; } for(var j=0; j 1) { if(i > 0) { $("tr").eq(4 + j).children().eq(width-i).removeClass('red'); } $("tr").eq(4 + j).children().eq(width-1-i).addClass('red'); } var tmp = parseInt($("tr").eq(4 + j).children().eq(width-1-i).text()); if(isNaN(tmp) == false) { sum += tmp; // console.log("sum= "+ sum) } } // console.log("sum= "+ sum) var x2 = sum + carry; if(x2 > 9) { // console.log("x2= " + x2) temp = x2.toString().split(""); add = parseInt(temp[0]); sum = parseInt(temp[1]); carry = 0; } $("tr").eq(height-1).children().eq(width-1-i).text(sum + carry); sum = 0; carry = add; add = 0; // console.log("carry= "+ carry) i++; },500) } }) $("#clear").on("click", function() { $("#input1").val(""); $("#input2").val(""); $("#total").html(""); }) })

Challenge : Multiplying like on paper