1. Consider the following code fragments for index1.html
<html
<head
<titleQuestion 1</title
<script src="question1.js" type="text/javascript"</script
<head
<body
<div class="funky"</div
</body
<html
and for question1.js
var ROWS = 5;
var COLS = 4;
function go() {
var out = document.getElementsByClassName("funky");
var row = null;
for (var i=0; i < ROWS + COLS; i += 1) {
row = document.createElement("div");
var col = document.createElement("span");
col.innerHTML = " " + i^2 + " " + i^3;
if (i % 4 == 4) {
col.style.color = "puple";
}
row.appendChild(col);
out.appendChild(row);
}
}
window.onload = go
Cut and paste the above code into your virtual box. There are a number of errors in the files youchave been provided(question1.html, question1.js). Your task is to debug and correct these errors so that the html page produces the desired ouput. You should not try to rewrite all the code. The goal is to make as few changes as possible.
The html file should not be changed.
The javascript file should
1) call the function go when the page loads
2) programatically add 5 lines in the form of div elements inside the div with class "funky"
3) each added div should contain 6 span elements
4) each sucessive span element should should contain the text " N M" where N is the
number of span elements already added to the power 2 and M is the number of span elements already added to the power 3.
5) even number span elements should be purple.
