DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Snippets has posted 5883 posts at DZone. View Full User Profile

JavaScript Automagically Hide And Show An HTML Tag (DIV, P, Whatever)

12.19.2006
| 29031 views |
  • submit to reddit
        If you want to hide or show an HTML tag using JavaScript, you can use the function below. It also changes the name of the link.

Here's the HTML code:
<a href="javascript:viewMore('two');" id="xtwo">... more</a>
<p>I see one.</p>
<p id="two" style="display:none">I see two.</p>

Here's the JavaScript code:
function viewMore(div) {
	obj = document.getElementById(div);
	col = document.getElementById("x" + div);
	
	if (obj.style.display == "none") {
		obj.style.display = "block";
		col.innerHTML = "... less";
	} else {
		obj.style.display = "none";
		col.innerHTML = "... more";
	}
}