How can I change the font colour of this JavaScript code?
<p>I'm trying to recreate the terminal animation for my web page. I tried changing the colour with a div class but I don't believe it is registering. What would be the best method to achieve this? Thanks a lot.</p>

<p><a href="https://jsfiddle.net/zx5qs2qy/" rel="nofollow noreferrer">https://jsfiddle.net/zx5qs2qy/</a></p>

<pre><code>&lt;html&gt;
&lt;head&gt;

&lt;div class="color"&gt;
&lt;script type='text/javascript'&gt;
var index = 0;
var text = 

    '&lt;span id="color"&gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque tincidunt, nulla at tempus tristique, nisl leo molestie est, ut vestibulum mauris mauris a odio. Sed at massa vitae ipsum venenatis porta. Integer iaculis pretium tempus. Donec viverra sollicitudin velit non gravida. Phasellus sit amet tortor odio. Vivamus lectus nisl, suscipit porttitor bibendum ut, tristique quis dui. Vestibulum non eros leo. Maecenas tincidunt semper turpis, a tristique purus pretium sit amet. Praesent nec neque tortor.Donec suscipit tristique ante quis molestie. Phasellus ac lacus non felis faucibus dictum vitae ac ipsum. Sed pharetra nulla sodales nulla porta imperdiet. Quisque pretium hendrerit laoreet.&lt;/span&gt;';


    // Here you can put in the text you want to make it type.
    function type()
{
    document.getElementById('screen').innerHTML += text.charAt(index);
    index += 1;
    var t = setTimeout('type()',100);
    // The time taken for each character here is 100ms. You can change it if you want.
}

{
    document.getElementById("color").style.color = "red"; // red or #ffffff

}

&lt;/script&gt;
&lt;/div&gt;
&lt;/head&gt;


&lt;body onload='type()'&gt;
&lt;!-- And here, you create the container in which you display the typed text --&gt;
&lt;div id='screen'&gt;&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>