<p dir="auto">Challenge doesn't count as complete on Firefox, same code works on Chrome just fine.</p>
<p dir="auto">Challenge <a href="http://beta.freecodecamp.com/en/challenges/applied-visual-design/adjusting-the-color-of-various-elements-to-complementary-colors" rel="nofollow">adjusting-the-color-of-various-elements-to-complementary-colors</a> has an issue.<br>
User Agent is: <code class="notranslate">Mozilla/5.0 (Windows NT 10.0; WOW64; rv:51.0) Gecko/20100101 Firefox/51.0</code>.<br>
Please describe how to reproduce this issue, and include links to screenshots if possible.</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="

&lt;style&gt;
  body {
    background-color: white;
  }
  header {
    background-color: #09A7A1;
    color: white;
    padding: 0.25em;
  }
  h2 {
    color: #09A7A1;
  }  
  button {
    background-color: #FF790E;
  }
  footer {
    background-color: #09A7A1;
    color: white;
    padding: 0.5em;
  }
&lt;/style&gt;
&lt;header&gt;
  &lt;h1&gt;Cooking with FCC!&lt;/h1&gt;
&lt;/header&gt;
&lt;main&gt;
  &lt;article&gt;
    &lt;h2&gt;Machine Learning in the Kitchen&lt;/h2&gt;
    &lt;p&gt;Join this two day workshop that walks through how to implement cutting-edge snack-getting algorithms with a command line interface. Coding usually involves writing exact instructions, but sometimes you need your computer to execute flexible commands, like &lt;code&gt;fetch Pringles&lt;/code&gt;.&lt;/p&gt;
    &lt;button&gt;Sign Up&lt;/button&gt;
  &lt;/article&gt;
  &lt;article&gt;
    &lt;h2&gt;Bisection Vegetable Chopping&lt;/h2&gt;
    &lt;p&gt;This week-long retreat will level-up your coding ninja skills to actual ninja skills. No longer is the humble bisection search limited to sorted arrays or coding interview questions, applying its concepts in the kitchen will have you chopping carrots in O(log n) time before you know it.&lt;/p&gt;
    &lt;button&gt;Sign Up&lt;/button&gt;
  &lt;/article&gt;
&lt;/main&gt;
&lt;br&gt;
&lt;footer&gt;&amp;copy;2016 FCC Kitchen&lt;/footer&gt;
"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>
  <span class="pl-ent">body</span> {
    <span class="pl-c1">background-color</span><span class="pl-kos">:</span> white;
  }
  <span class="pl-ent">header</span> {
    <span class="pl-c1">background-color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>09A7A1</span>;
    <span class="pl-c1">color</span><span class="pl-kos">:</span> white;
    <span class="pl-c1">padding</span><span class="pl-kos">:</span> <span class="pl-c1">0.25<span class="pl-smi">em</span></span>;
  }
  <span class="pl-ent">h2</span> {
    <span class="pl-c1">color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>09A7A1</span>;
  }  
  <span class="pl-ent">button</span> {
    <span class="pl-c1">background-color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>FF790E</span>;
  }
  <span class="pl-ent">footer</span> {
    <span class="pl-c1">background-color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>09A7A1</span>;
    <span class="pl-c1">color</span><span class="pl-kos">:</span> white;
    <span class="pl-c1">padding</span><span class="pl-kos">:</span> <span class="pl-c1">0.5<span class="pl-smi">em</span></span>;
  }
<span class="pl-kos">&lt;/</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">header</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>Cooking with FCC!<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">header</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">main</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">article</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">h2</span><span class="pl-kos">&gt;</span>Machine Learning in the Kitchen<span class="pl-kos">&lt;/</span><span class="pl-ent">h2</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>Join this two day workshop that walks through how to implement cutting-edge snack-getting algorithms with a command line interface. Coding usually involves writing exact instructions, but sometimes you need your computer to execute flexible commands, like <span class="pl-kos">&lt;</span><span class="pl-ent">code</span><span class="pl-kos">&gt;</span>fetch Pringles<span class="pl-kos">&lt;/</span><span class="pl-ent">code</span><span class="pl-kos">&gt;</span>.<span class="pl-kos">&lt;/</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">button</span><span class="pl-kos">&gt;</span>Sign Up<span class="pl-kos">&lt;/</span><span class="pl-ent">button</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">article</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">article</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">h2</span><span class="pl-kos">&gt;</span>Bisection Vegetable Chopping<span class="pl-kos">&lt;/</span><span class="pl-ent">h2</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>This week-long retreat will level-up your coding ninja skills to actual ninja skills. No longer is the humble bisection search limited to sorted arrays or coding interview questions, applying its concepts in the kitchen will have you chopping carrots in O(log n) time before you know it.<span class="pl-kos">&lt;/</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>
    <span class="pl-kos">&lt;</span><span class="pl-ent">button</span><span class="pl-kos">&gt;</span>Sign Up<span class="pl-kos">&lt;/</span><span class="pl-ent">button</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;/</span><span class="pl-ent">article</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">main</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">br</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">footer</span><span class="pl-kos">&gt;</span>&amp;copy;2016 FCC Kitchen<span class="pl-kos">&lt;/</span><span class="pl-ent">footer</span><span class="pl-kos">&gt;</span></pre></div>
<h4 dir="auto">Issue Description</h4>
<p dir="auto">This is for the feature/curriculum-expansion branch only when run locally, and NOT the staging branch.</p>
<p dir="auto">For several challenges (challengeType: 0, using the code editor with the mobile-phone output layout), the jQuery method .css() doesn't seem to be accessing the styles applied in a <code class="notranslate">style</code> tag in the given code. This is affecting any assert tests that use a pattern of <code class="notranslate">assert($('selector').css('propertyToCheck') == 'valueToCompare', 'message: ...');</code>.Here's an example:</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;style&gt;
 h2 {
   position: relative; 
   top: 15px;
 }
&lt;/style&gt;
&lt;body&gt;
  &lt;h1&gt;On Being Well-Positioned&lt;/h1&gt;
  &lt;h2 class=&quot;testCode&quot;&gt;Move me!&lt;/h2&gt;
  &lt;p&gt;I still think the h2 is where it normally sits.&lt;/p&gt;
&lt;/body&gt;
&lt;script&gt;
  console.log($('h2').attr('class')); // Works great, returns testCode
  console.log($('h2').css('position')); // returns undefined
  console.log($('h2').css('top')); // returns undefined
&lt;/script&gt;"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>
 <span class="pl-ent">h2</span> {
   <span class="pl-c1">position</span><span class="pl-kos">:</span> relative; 
   <span class="pl-c1">top</span><span class="pl-kos">:</span> <span class="pl-c1">15<span class="pl-smi">px</span></span>;
 }
<span class="pl-kos">&lt;/</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">body</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>On Being Well-Positioned<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">h2</span> <span class="pl-c1">class</span>="<span class="pl-s">testCode</span>"<span class="pl-kos">&gt;</span>Move me!<span class="pl-kos">&lt;/</span><span class="pl-ent">h2</span><span class="pl-kos">&gt;</span>
  <span class="pl-kos">&lt;</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>I still think the h2 is where it normally sits.<span class="pl-kos">&lt;/</span><span class="pl-ent">p</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">body</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">script</span><span class="pl-kos">&gt;</span>
  <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-en">$</span><span class="pl-kos">(</span><span class="pl-s">'h2'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">attr</span><span class="pl-kos">(</span><span class="pl-s">'class'</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// Works great, returns testCode</span>
  <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-en">$</span><span class="pl-kos">(</span><span class="pl-s">'h2'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">css</span><span class="pl-kos">(</span><span class="pl-s">'position'</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// returns undefined</span>
  <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-en">$</span><span class="pl-kos">(</span><span class="pl-s">'h2'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">css</span><span class="pl-kos">(</span><span class="pl-s">'top'</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span> <span class="pl-c">// returns undefined</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">script</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">Related assert tests that aren't passing:</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="assert($('h2').css('position') == 'relative', 'message: Add a CSS rule to specify that the &lt;code&gt;h2&lt;/code&gt; has a &lt;code&gt;position&lt;/code&gt; set to &lt;code&gt;relative&lt;/code&gt;.');

assert($('h2').css('top') == '15px', 'message: Use a CSS offset to relatively position the &lt;code&gt;h2&lt;/code&gt; 15px away from the &lt;code&gt;top&lt;/code&gt; of where it normally sits.');"><pre class="notranslate"><span class="pl-en">assert</span><span class="pl-kos">(</span><span class="pl-en">$</span><span class="pl-kos">(</span><span class="pl-s">'h2'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">css</span><span class="pl-kos">(</span><span class="pl-s">'position'</span><span class="pl-kos">)</span> <span class="pl-c1">==</span> <span class="pl-s">'relative'</span><span class="pl-kos">,</span> <span class="pl-s">'message: Add a CSS rule to specify that the &lt;code&gt;h2&lt;/code&gt; has a &lt;code&gt;position&lt;/code&gt; set to &lt;code&gt;relative&lt;/code&gt;.'</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

<span class="pl-en">assert</span><span class="pl-kos">(</span><span class="pl-en">$</span><span class="pl-kos">(</span><span class="pl-s">'h2'</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">css</span><span class="pl-kos">(</span><span class="pl-s">'top'</span><span class="pl-kos">)</span> <span class="pl-c1">==</span> <span class="pl-s">'15px'</span><span class="pl-kos">,</span> <span class="pl-s">'message: Use a CSS offset to relatively position the &lt;code&gt;h2&lt;/code&gt; 15px away from the &lt;code&gt;top&lt;/code&gt; of where it normally sits.'</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<h4 dir="auto">Browser Information</h4>
<ul dir="auto">
<li>Browser Name, Version: Firefox 48.0.1</li>
<li>Operating System: Mac OS X, El Capitan v10.11.3</li>
<li>Mobile, Desktop, or Tablet:</li>
</ul>