Menu
I am trying to add new elements to an unordered list with the following code:
The HTML:
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Javascript</title>
<link rel="stylesheet" href="jsPlay.css" type="text/css" />
<script src="jsPlay.js"></script>
</head>
<body>
<ul id="numberList"></ul>
</body>
</html>
The Javascript:
window.onload = function()
{
//alert("Window is loaded");
var numberList = document.getElementById("numberList");
//for every number between 100 and 200
for(var i = 0; i > 100 && i < 200; i++)
{
if ( i % 17 == 0 && i % 2 == 0) //if number evenly divisible by 17 and 2
{
//create new li element
var newNumberListItem = document.createElement("li");
//create new text node
var numberListValue = document.createTextNode(i);
//add text node to li element
newNumberListItem.appendChild(numberListValue);
//add new list element built in previous steps to unordered list
//called numberList
numberList.appendChild(newNumberListItem);
}
}
}
When I run this in my browser, I just get nothing but white-space. I check in FireBug (on Firefox 15.0.1) to see if there are any errors, but there is nothing noticeable. I think I am not binding something together properly - it seems like such a basic problem but I can't seem to fgure out why the elements aren't being added to the unordered list.
I'm sure the commenting in the Javascript code is sufficient, but feel free to ask me questions if it isn't.
Many thanks for the help :).
420
Your for loop immediately fails because i is not greater than 100. If you try something like this it should work:
for (var i = 100; i < 200; i++)
Example: http://jsfiddle.net/grc4/gc4X5/1/
199
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
