<!DOCTYPE html>
<html>
<head>
<style>
table {
border-collapse: collapse;
}
td {
border: 1px solid black;
padding: 3px 5px;
}
</style>
</head>
<body>
<h1>ZERO Hello Plunker!</h1>
<div>ONE Users:</div>
<ul>TWO
<li>John</li>
<li>Pete</li>
</ul>
<ul>THREE
<li><a href="https://www.w3schools.com/js/js_htmldom_navigation.asp" target="_blank">background to navigation</a></li>
<li><a href="https://www.w3schools.com/js/js_htmldom_navigation.asp" target="_blank">JS navigation tutorial (useful for table exercises b)</a> </li>
</ul>
<hr />
<table>
<tr>
<td>1:1</td>
<td>2:1</td>
<td>3:1</td>
<td>4:1</td>
<td>5:1</td>
</tr>
<tr>
<td>1:2</td>
<td>2:2</td>
<td>3:2</td>
<td>4:2</td>
<td>5:2</td>
</tr>
<tr>
<td>1:3</td>
<td>2:3</td>
<td>3:3</td>
<td>4:3</td>
<td>5:3</td>
</tr>
<tr>
<td>1:4</td>
<td>2:4</td>
<td>3:4</td>
<td>4:4</td>
<td>5:4</td>
</tr>
<tr>
<td>1:5</td>
<td>2:5</td>
<td>3:5</td>
<td>4:5</td>
<td>5:5</td>
</tr>
</table>
<script type="text/javascript" charset="utf-8">
//SIX
// Exercise 1 - open console then print lengths of body.children
// body.childNodes collections
// Exercise 2 - print the lastElementChild of body
// Exercise 3 - print all children of body
// Exercise 4 - print 'background to navigation' using DOM navigation
// Exercise 5 - Access the table and put it inside a variable called T
// Exercise 6 - change the background table cell 2:3 to blue (careful about indexing!)
// Exercise 7 - Change all the diagonal cells' background to red
</script>
</html>
// Code goes here
/* Styles go here */