Manipulating HTML in Javascript

I am trying to manipulate the text that is already inside the div and replace it with another strings from JavaScript, creating a basic animating effect by replacing particular character from strings present inside the div element, more precisely position based replacement of string. However when I wrote down the following code it doesn't work. What I wanted to do is that store the original text in one variable and when the dom replacement of text occurs then setting certain interval replace by the old text and again replace by the new randomize text creating text replacement animation in certain position of the text.code :\[code\]<!DOCTYPE html><html><head><script type="text/javascript">var all ="ABCDEFGHIJKLMNOPQRSTUVWXYZa{}[];:></?bcdefghijklmnopqrstuvwxyz0123+_)(*&^%$#@!~`456789";var old_text = document.getElementById("text").innerText;function randChar() { "use strict"; return all.charAt(Math.floor(Math.random()*all.length)); }function main() { "use strict"; var $_inter = setInterval(function() { var text = document.getElementById("text"); text.innerHTML = text.innerHTML.substring(0, 5) + randChar() + text.innerHTML.substring(5); setTimeout(function(){ text.innerHTML = old_text; },200); }, 350);}window.onload = main;</script></head><body><div id="text">Hello World!</div></body></html>\[/code\]So in order to make it work for a while I used the original string as\[code\]setTimeout(function(){ text.innerHTML = "Hello World!"; },200);\[/code\]Which is not possible as the text in page might have been generated dynamically. When I did run the first code it says innerText of Null.The exact error it throws is:\[quote\] Uncaught TypeError: Cannot read property 'innerText' of null\[/quote\]What does that mean, because text and element is there why can't it grab the text from dom?
 
Back
Top