document.write() overwrites entire page

So, I was trying to make HTML appear at the click of a button, but instead of inserting the HTML right where the script tag was, the entire page was overwritten with the code that was supposed to be generated. After experimenting, I found that something simple like



document.write("p" + "Hello!" + "p")



would simply insert it as it should. (I couldn't include the brackets for the p tag. Kept recognizing them as an HTML tag and wouldn't let me reference the tag.) On the other hand, the code I was trying to do replaced the entire page. Does anyone know how to fix this? Here is some example code.

The sample code has the name of HTML tags surrounded in square brackets instead of angle brackets to keep the code from breaking since StackExchange keeps thinking it should do something with these tags. function writeIFrame() { document.write('[iframe width="500" height="300" src="http://ift.tt/1B5XHLS" frameborder="0" allowfullscreen][/iframe][p]Check out my YouTube channel [a href="http://ift.tt/1DMefyB"]here[/a] and subscribe!'); }

Thanks to anyone who can help and diagnose this problem!