See http://docs.jquery.com/Frequently_Asked_Questions#Why_doesn.27t_an_event_work_on_a_new_element_I.27ve_created.3F
- Richard On Fri, Dec 18, 2009 at 12:23 AM, Jason Kaczmarsky <jkaczmar...@yahoo.com>wrote: > Ahah, this was the problem I thought i was having. I can't make jQuery > work on dynamic content. > > If an element with a class of "file" is added to the document, like > the previous case, no jQuery event related to that element works. > Ex: > $(".file").click(function(){ > alert(this) > }); > Nothing is ever alerted if that element is clicked. > > Example page: > http://pendarenstudios.com/NEW/file_sel.php > On Dec 17, 10:39 am, Jason Kaczmarsky <jkaczmar...@yahoo.com> wrote: > > I must have missed something cause I made a new page and rewrote the > > code and it worked fine. Thanks for the help guys. > > > > On Dec 17, 5:26 am, "Richard D. Worth" <rdwo...@gmail.com> wrote: > > > > > 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? >