Member Avatar for hiyatran

I can't seem to get my innerHTML to display my content.

This works fine, if I was to put it all in one line.

document.getElementById('addedText').innerHTML =  '<table><tr><td>'+"My text goes here"+'</tr></td></table>';

If I was to break it up, which I wanted then nothing seem to show up.

document.getElementById('addedText').innerHTML = '<table><tr><td>';
   document.getElementById('addedText').innerHTML = "My text goes here";
   document.getElementById('addedText').innerHTML = '</tr></td></table>';

Here's my code

<html>
<head>
<script type="text/javascript"> 
function display() {
   document.getElementById('addedText').innerHTML = '<table border=1><tr><td>';
   document.getElementById('addedText').innerHTML = "My text goes here";
   document.getElementById('addedText').innerHTML = '</tr></td></table>';
}
</script>
</head>

<body onload="display()">
<div id="addedText"></div>
</body>
</html>

thanks

  • 2 Contributors
  • 1 Reply
  • 93 Views
  • 8 Hours Discussion Span
  • Latest Post Latest Post by Anirudh Rb
Member Avatar for Anirudh Rb

When you use innerHTML the previous HTML inside the element is replaced with the new HTML.

So, according to what you have written the contents of the element with id 'addedText' after the execution of the script will be

</tr></td></table>

(It is quite evident that this HTML snippet will not display anything.)

Edited by Anirudh Rb because: n/a
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.