<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
This give us a list, but what about showing data in the list. Well to do that we will use the <li> or list item element of the list. We then put it into our code behind. Our code behind file is called “myList.js” and the HTML file should be called “myList.HTML” . Remember both will need to be at the same folder. Here’s the code;
window.onload = function()
var test = [
var test2 = [
for (var i = 0; i < test.length; i++)
//create new li element
var newStateListItem = document.createElement(“li”);
//create new text node
var stateListValue = document.createTextNode(test[i] + “: ” + test2[i] );
//add text node to li element
//add new list element built in previous steps to unordered list
That’s a lot of stuff. Let’s break it down. We need something to hold our data. We are using two arrays, ( yes I know we could use one) but this is an attempt to keep things very simple later on. This is done with the var test = [data,data] statement. Of course test2 holds the capital names. The next part of the function iterates thru the data and creates a <li>, (list item) for each. The list item is give the value of the arrays and added to the stateList using appendChild. This should give you the following output.
So that should get us started.