title: Getting a field from a named CSS style in Javascript
body: <p>I have an HTML document with a link tag in its head to a particular CSS stylesheet:</p>
  
  <pre><code>&lt;link rel="stylesheet" href="style.css" type="text/css"&gt;
  </code></pre>
  
  <p>This <code>.css</code> file contains a particular class, like so:</p>
  
  <pre><code>.mystyle {
      color: #00c;
  }
  </code></pre>
  
  <p>What I'm trying to do is to grab that class's <code>color</code> field, so that I can use it dynamically in another part of the page (for another element's <code>background-color</code>). Is there any way in a JavaScript program to access that information, by the name of the class? Something like this:</p>
  
  <pre><code>var myColor = document.getStyle(".mystyle").color;
  </code></pre>
  
  <p>Some caveats:</p>
  
  <ol>
  <li>There may or may not be other stylesheets that are also linked from this HTML document.</li>
  <li>There may or may not be any particular elements on the page that are styled with this particular class.</li>
  <li>I've already tried setting a temporary element to have the given class, and then grabbing its <code>color</code> field. That didn't work: the <code>color</code> field contains the empty string.</li>
  </ol>
  
  <p>Thanks.</p>