Menu
I have the following code. I am trying to add an item in the unorderedlist sing javascript when. the new list item is added when the checkbox is checked. And iam trying to remove the corresponding list item when the checkbox is unchecked. Is it possible? Any help from the web gurus will be greatly appretiated.
[CODE]<html>
<head>
<title>Insert title here</title>
<script type=”text/javascript” language=”JavaScript”>
function Addlistitem(list_id) {
var chname = document.getElementById(list_id).name;
if (document.getElementById(list_id).checked == true) {
var element = chname;
var container = document.getElementById(‘myList’);
var new_element = document.createElement(‘li’);
new_element.innerHTML = element;
container.insertBefore(new_element, container.firstChild);
document.getElementById(‘newElement’).value = “”;
}
else {
alert(“its unchecked”);
//need help here to delete the added list item when its corresponding checkbox is unchecked.
}
}
</script>
</head>
<body>
<form name=”form1″/>
<input type=”checkbox” name=”ch1″ id=”c1″ onclick=”JavaScript:Addlistitem(‘c1’);”
value=”10″ />
<input type=”checkbox” name=”ch2″ id=”c2″ onclick=”JavaScript:Addlistitem(‘c2’);”
value=”11″ />
<input type=”checkbox” name=”ch3″ id=”c3″ onclick=”JavaScript:Addlistitem(‘c3’);”
value=”12″ />
<input type=”checkbox” name=”ch4″ id=”c4″ onclick=”JavaScript:Addlistitem(‘c4’);”
value=”13″ />
<input type=”checkbox” name=”ch5″ id=”c5″ onclick=”JavaScript:Addlistitem(‘c5’);”
value=”14″ />
<input type=”checkbox” name=”ch6″ id=”c6″ onclick=”JavaScript:Addlistitem(‘c6’);”
value=”15″ />
<input type=”checkbox” name=”ch7″ id=”c7″ onclick=”JavaScript:Addlistitem(‘c7’);”
value=”16″ />
<ul id=”myList”>
</ul>
</form>
</body>
</html>