title: jQuery $.css() function not interpreting "animation-delay" properly (in webkit browsers!)
body: <p><strong><em>Edited - linked the wrong codepen</em></strong>
  <strong><em>This only seems to happen in webkit browsers. In firefox it works as intened. In IE, the right inline-style is added but it doesn't add the prefix(even if I specify 'ms-animation-delay' in the javascript instead of just 'animation-delay'</em></strong></p>
  
  <p>I'm playing with a codepen trying to replicate some Google Material effects ( I know they have them in polymer, I just wanted to try to replicate some of the effects for fun). For some odd reason, jQuery is wrongly putting "animation: [value]" into the inline-styling instead of "animation-delay: [value]". Can anyone explain why and how to make a work around? </p>
  
  <p>Here's the codepen: <a href="http://codepen.io/nickgofly/pen/DAhuK" rel="nofollow">link</a></p>
  
  <p>JS:</p>
  
  <pre><code>$(document).ready(function(){
    var lis = $("li"), str;
  
    for(var x=2; x&lt;= lis.length; x++){
      str=(0.2+ 0.1*(x-2))+"s";
      lis.eq(x-1).css({"animation-delay": str});
    }
  });
  </code></pre>
  
  <p>This also occurs with transition-delay. </p>