Works for me:
http://jsbin.com/egoto/
- Richard
On Wed, Dec 16, 2009 at 8:44 PM, Jason Kaczmarsky <jkaczmar...@yahoo.com>wrote:
> Yes, I am sure they are the correct class and are showing up properly.
>
> Button press:
> //loop
> $("#files").append('<div class="file">'+Files[i]+'</div>');
> //end loop
>
> Firebug:
> <div id="files" style="display: block;">
> <div class="file">work.txt</div>
> <div class="file">SAS Guide.txt</div>
> </div>
>
> On Dec 16, 7:43 pm, "Smith, Allex" <allex.sm...@chelanpud.org> wrote:
> > The browser should render all the styles no matter when they enter.
> >
> > Are you sure that the class is assigned to those elements? I would make
> sure by peeking at the rendered html via Firebug.
> >
> > -----Original Message-----
> > From: jquery-en@googlegroups.com [mailto:jquery...@googlegroups.com] On
> Behalf Of Jason Kaczmarsky
> > Sent: Wednesday, December 16, 2009 2:14 PM
> > To: jQuery (English)
> > Subject: [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?
>
