jQuery - Ruby Rails - fadeTo fades all div

I am trying jQuery fadeTo to fade background color of a div (error class), while keeping a inner div unchanged. But in Chrome and firefox both the "error" div and any text inside an inner div both get faded. In IE it works, just the error div gets faded but not any div inside it. How do I make work for all browsers?

View -

<div class="error" style="display: inline-block;z-index:1;">
 <div style="position:relative;z-index:2;">Error: <%= @a[:error] %>
 </div>
 </div>
 

html -

<div class="error" style="z-index:1;height=300px;width=500px;">
 <div style="position:relative; z-index:2;">Error: some error</div>
 </div>
 

javascript -

$(document).ready(function(){
 $(".error").fadeTo("slow",0.20);
 });
 

---