title: jQuery animate css borderColor not working
body: <p>I have a google map and when pressing a marker a infoBox opens, AND one div on a list of objects gets <code>.style.borderColor="#FFF";</code></p>
  
  <p>On <code>mouseout</code> of that infoBox I want it to go back to <code>border-color:#000;</code></p>
  
  <p>This works with javascript/jQuery</p>
  
  <pre><code>document.getElementById("rank_" + data.id).style.borderColor="#000"; //works good
  $("#rank_" + data.id).css({borderColor: '#000'}); // also works good
  </code></pre>
  
  <p>this doesn't work</p>
  
  <pre><code>$("#rank_" + data.id).animate({ "border-color": "#000" }, 600);
  //or
  $("#rank_" + data.id).animate({ borderColor: "#000" }, 600);
  //tried also this wich works but without animation
  $("#rank_" + data.id).css({borderColor: '#000'}).animate({ borderColor: "#000" }, 900);
  </code></pre>
  
  <p>Any ideas on what I am missing?<br>
  simplified example <strong><a href="http://codepen.io/anon/pen/JKtjn" rel="nofollow">here</a></strong></p>