How to access outer html in Javascript for a HTML element
Outer HTML
The following code tells you difference between inner html and outer html.
Example
<!DOCTYPE HTML>
<html>
<body>
<table>
<tbody>
<tr id="myRow"><td>A</td><td>B</td></tr>
</tbody>
</table>
<textarea rows="3" id="results"></textarea>
<button id="inner">Inner HTML</button>
<button id="outer">Outer HTML</button>
<script>
var results = document.getElementById("results");
var row = document.getElementById("myRow");
document.getElementById("inner").onclick = function() {
results.innerHTML = row.innerHTML;
}; <!--from w w w . ja va 2 s . c o m-->
document.getElementById("outer").onclick = function() {
results.innerHTML = row.outerHTML;
}
</script>
</body>
</html>