title: Setting -os-/-ms prefix for background gradient in jQuery fails to work?
body: <p>I've seen a couple of other posts on here in regards to jQuery <code>.css()</code> not working with <code>-webkit-gradient</code>, however I've yet to find one pertaining to <code>-ms-linear-gradient</code>, <code>-o-linear-gradient</code> and <code>linear-gradient</code>.</p>
  
  <p>Long story short, I've created a function which sets a <code>#hex</code> based background gradient for an element using the all the most popular CSS properties for cross-browser compatibility, taken directly from <a href="http://www.colorzilla.com/gradient-editor/" rel="nofollow">ColorZilla</a>.</p>
  
  <p><strong>Here's a look at the particular snippet I'm talking about:</strong></p>
  
  <pre><code>$(elem).css({
          'background': b,
          'background': '-moz-linear-gradient(top,  '+a+' 0%, '+b+' 100%)', 
          'background': '-webkit-gradient(linear, left top, left bottom, color-stop(0%,'+a+'), color-stop(100%,'+b+'))',
          'background': '-webkit-linear-gradient(top,  '+a+' 0%,'+b+' 100%)',
          'background': '-o-linear-gradient(top,  '+a+' 0%,'+b+' 100%)', // Breaks execution
          'background': '-ms-linear-gradient(top,  '+a+' 0%,'+b+' 100%)', // Breaks execution
          'background': 'linear-gradient(top,  '+a+' 0%,'+b+' 100%)', // Breaks execution
          'filter': 'progid:DXImageTransform.Microsoft.gradient( startColorstr=\''+a+'\', endColorstr=\''+b+'\',GradientType=0 )'
          });
  </code></pre>
  
  <p>I've placed a <code>//breaks execution</code> comment next to each of the properties that when active (either collectively, or individually) break the script's execution (no other properties, e.g. <code>background: b</code> (<code>b</code> of course being a variable) are set.</p>
  
  <p>I'm absolutely stumped as to why this is.</p>
  
  <p><strong>So far I've tried:</strong></p>
  
  <ul>
  <li>Using double quotes instead of single quotes.</li>
  <li>Replacing the variable usage (<code>+a+</code>, <code>+b+</code>) with actual hex's.</li>
  </ul>
  
  <p>I'm thinking perhaps there's a character in those three that needs to be escaped or something?</p>
  
  <p>Any help towards figuring out why this is would be greatly appreciated!</p>