473,386 Members | 1,720 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,386 software developers and data experts.

How will create Unordered List dynamically using JavaScripe

Suppose I have an Unordered List in my HTML file:


[HTML]<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function remove(){
//code to remove the old elements
var d=document.getElementById("forum");
d.parentNode.removeChild(d);
//code to add new elements
var li =document.createElement("li");
var p = document.createTextNode('Hello');
li.appendChild(p);
d.insertBefore(li, 1); //this is not working
}
</SCRIPT>
</head>
.....
<ul id="forum">
<li>JavaScript</li>
<li>Forum</li>
</ul>

....
<input type="button" onclick="remove()" >
</html>[/HTML]


Now, what is the code I have to write to remove to add new elements after removing all the parent elements?

Plz sort out my problem... Thanks in advance.

regards,
Ranjan Y
Mar 5 '08 #1
5 11559
gits
5,390 Expert Mod 4TB
you could use the replaceChild() method for that purpose ...

kind regards
Mar 5 '08 #2
you could use the replaceChild() method for that purpose ...

kind regards

Hi Gits,
Thanks for ur quick reply. What I exactly want is...

Step 1: Remove all the existing elements of the unordered list
Step 2: Start adding new elements
Mar 5 '08 #3
gits
5,390 Expert Mod 4TB
as i said ... you just could create a new ul- and its li-nodes and replace the current one or you shouldn't use removeChild fo the ul-node and set its innerHTML to an empty string instead and append the li-elements you create directly to the existing ul-node ...

kind regards
Mar 5 '08 #4
as i said ... you just could create a new ul- and its li-nodes and replace the current one or you shouldn't use removeChild fo the ul-node and set its innerHTML to an empty string instead and append the li-elements you create directly to the existing ul-node ...

kind regards
Thanks Gits... I have got the idea and my problem has been addressed.
Mar 5 '08 #5
gits
5,390 Expert Mod 4TB
post back when you encounter problems with it :)

kind regards
Mar 5 '08 #6

Sign in to post your reply or Sign up for a free account.

Similar topics

3
by: Kevin Campbell | last post by:
Say I have the following XML spec: <Book> <Title /> <Author /> <ISBN /> <Description /> </Book> Title, Author, ISBN and Description may appear in any order. Title,
1
by: Nathan Sokalski | last post by:
I want to add a bulleted list to my document in ASP.NET. I know the HTML code, and I have used the HtmlGenericControl, but is there an ASP.NET object that can generate UL and LI tags from a set of...
6
by: Rich | last post by:
Hello, I want to simulate the dynamic thumbnail display of Windows Explorer (winxp) on a form or pannel container. If I place a picture box on my container form/pannel and dimension it to the...
1
by: michael | last post by:
Good Morning, I have an unordered list similar to: <ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> </ul>
5
by: ibiza | last post by:
Hi all, I have a question which I have no ideal of the answer...I am currently working on a web application and at some time, I have a string representing a short text. This could be a simple...
1
by: simplico | last post by:
I'm creating an unordered list that fits in a defined width on the left side of the page. It works fine in FF but IE is another story. Here is a watered-down version of the code: <html>...
3
by: User | last post by:
Hi, Is it possible to transform Ordered/Unordered list into navigation dropdown menus? Is this effect achieved by CSS? or via Javascript? PLease advise Thanks.
2
by: torweb | last post by:
I'm using an image for an unordered list, which works fine. The problem is, the image is also appearing in my numbered "ordered list." Here is my code for the unordered list:...and thanks in...
2
by: asc4john | last post by:
When including an unordered list in an unordered list: Should it be included as a "list" item as in: <ul><liitem</ li><ul.... </ul<liitem</li</ul> or included in the LI element as in:...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.