How to refresh the page on document.write
<p>I am using <code>document.write</code> in a function to give different CSS to user's based on their choosing.</p>

<pre><code>function blue() {
    document.write('&lt;link rel="stylesheet" type="text/css"  href="http://ilam.irib.ir/documents/697970/237563314/blue.css" /&gt;');
}
</code></pre>

<p>I am calling the function from an anchor tag.</p>

<pre><code>function color2(){
    document.getElementById("navigation").innerHTML +='&lt;a class="myButton" onclick="blue()" background-color:"#05c8f2";&gt;&lt;/a&gt;'; 
}
</code></pre>

<p>As you can guess, when the link is clicked, the page clears out and I get a blank page.</p>

<p>Is there any way to fix this problem? I don't want to stop page refreshing, I'm just trying to fix the problem in any way possible!</p>

<p>Note: don't ask why I'm adding code using JavaScript, and not directly into HTML code. This site is a large scale system and we just have access to JavaScript and CSS. So this is all we can do to edit our pages.</p>