[jQuery] Styling dynamic content

So I've created a little app which loads some filenames into a div via
an AJAX query. This happens when a user clicks a button, not when the
page loads. Because of this, I cannot style the filenames how I want.
I've tried using CSS to do the trick:

.file{
color: #F00;
}

.file:hover{
cursor:pointer;
color:#000;
}

This CSS colors the filenames red when it loads, but nothing in the
hover event works.

Instead of this, I tried using jQuery to style it.

$(".file").hover(function(){
                $(this).css("background-color","#F00");
        },function(){
                $(this).css("background-color","#000");
        });

This also does not change anything. I assume it is because the element
does not exist when the page is rendered, but later on. Although this
doesn't explain why the text is red when I use the CSS, so I'm a bit
confused. How would I accomplish this?