cash23523
Programmer
- Apr 12, 2007
- 4
These seems like and easy solution but I can't seem to find the right answer. How can you delete <div> tags within html using the onclick command from an image or button in javascript?
Here's what I am doing. When the user clicks on a hyperlinked word within the main text of the document in a web page there is a right hand panel that displays the word and the correlating definition. Each time the user clicks another word the new definition appears below the old definition and so on. For each definition I am dynamically creating a <div></div> tag where the word, definition, and formatting appear bewteen the tags. The div gets its ID from the word so I can call it again later to remove it. For each div I add a small image within it that is a red close button. So the user can click on that single definition and close it essentially closing the div. That way there are not several word definitions running down the right hand margin of the page. I hope that makes sense. I thought it would be easier if I explained what I was doing.
I have been using this simple code which is called when the user clicks on the small close image/button.
function closeDiv(strWord) {
var divNum = strWord;
var sr = document.getElementById(strWord);
sr.innerHTML = "";
}
It works but it doesn't delete or remove the div tag. And when the user clicks on a new word, the definition shows up below the old blank div. Eventually you get a bunch of blank new lines where the old div html use to be. Instead of making the html blank I just need to delete or remove the div altogether. Can this be done?
Thanks
Here's what I am doing. When the user clicks on a hyperlinked word within the main text of the document in a web page there is a right hand panel that displays the word and the correlating definition. Each time the user clicks another word the new definition appears below the old definition and so on. For each definition I am dynamically creating a <div></div> tag where the word, definition, and formatting appear bewteen the tags. The div gets its ID from the word so I can call it again later to remove it. For each div I add a small image within it that is a red close button. So the user can click on that single definition and close it essentially closing the div. That way there are not several word definitions running down the right hand margin of the page. I hope that makes sense. I thought it would be easier if I explained what I was doing.
I have been using this simple code which is called when the user clicks on the small close image/button.
function closeDiv(strWord) {
var divNum = strWord;
var sr = document.getElementById(strWord);
sr.innerHTML = "";
}
It works but it doesn't delete or remove the div tag. And when the user clicks on a new word, the definition shows up below the old blank div. Eventually you get a bunch of blank new lines where the old div html use to be. Instead of making the html blank I just need to delete or remove the div altogether. Can this be done?
Thanks