Why .css isn't working

.cc .style etc and jQuery .blue not working for me~!

HTML

<h1>Frontend debugging thru better coding practices:</h1>

<p>javascript</p>
<pre>
    .css() is jQuery.
    .style is js.
</pre>

<p>jQuery</p>
<pre>
    .css is a jQuery function.
    $("jQuerySelector").css("propertyname","value");
    .style is a js function
    Chrome does not support jQuery .blue()
</pre>
<pre>
    :eq() and :nth-child() have two very different purposes:
</pre>
<ul>
  <li><a href="http://api.jquery.com/eq-selector/">eq-selector</a></li>
  <li><a href="http://api.jquery.com/:nth-child/">:nth-child</a></li>
</ul>
<pre>
    :eq() selects an element based on it's index in the array of selected elements.
        so use this for exact selections.
    :nth-child() selects all elements that are the nth child of their parent.
        so use this for group selections.
</pre>

<p>What causes errors in HTML?</p>



<ul>
  <li>Unclosed elements: If an element is <strong>not closed properly, then its effect can spread to areas you didn't intend</strong></li>
  <li>Badly nested elements: Nesting elements properly is also very important for code behaving correctly. <strong>strong <em>strong emphasised?</em> </strong> <em> what is this?</em></li>
  <li>Unclosed attributes: Another common source of HTML problems. Let's look at an example: <a href="https://www.mozilla.org/"> link to Mozilla homepage</a> </li>
</ul>

JavaScript

document.getElementsByTagName('pre').text.css("color: blue;")