ansaurus

Question

How do you attach a click event to a jquery object created programmatically?

Answer 1

+2 A:

Your mistake is here:

$("ul.myLinks li").click(function() {
    alert('hello');
});

That should be .myLinks ul li instead, as your myLinks class is on a <div>, not a <ul>.

If that still doesn't work, then Evgeny is right in that you should be attaching click events to your <a>s and not their containing <li>s.

BoltClock 2010-09-01 03:32:14

Better yet, OP should use `.delegate()` and then only one function will be attached and any/all of the `li`'s in the `ul` will have that event handler.

Jeff Rupert 2010-09-01 03:34:12

@Jeff Rupert +1, Thanks, this is something new i learnt.

naikus 2010-09-01 05:13:51

Thanks, this solved my problem.

mksuth 2010-09-03 00:55:13

Answer 2

+1 A:

In addition to what BoltClock said, it looks like you're attaching the event handler to the list items, rather than the hyperlinks inside them. Try $(".myLinks ul li a").

I would also test the selector to make sure it's returning what you want. Step through it in Firebug or do something like alert($(".myLinks ul li a")[0]);

Evgeny 2010-09-01 03:33:06

Answer 3

+1 A:

You could try something like this:

$('div.myLinks ul')
  .append( '<li><a href="#myLink1">some link</a></li>' )
  .delegate( 'a','click', function(e){
    e.preventDefault();
    alert('hi');
  });

Here's a working example.

Of course, the .append() would more likely be a bunch of lis -- something you can build any number of ways:

var $bunchOfLi = $('<li><a href="#myLink1">some link</a></li>')
  .add('<li><a href="#myLink2">another link</a></li>')
  .add('<li><a href="#myLink3">yet another link</a></li>');

...and thus:

.append( $bunchOfLi )

...as in this working example.

Ken Redler 2010-09-01 03:57:21

This is more or less exactly what I need going forward. Thanks for the working examples!

mksuth 2010-09-03 00:55:47

@mksuth, glad to help. Whether this or another, don't forget to accept an answer. Doing so makes it more likely you'll get answers to your questions in the future.

Ken Redler 2010-09-03 02:42:52

ansaurus

tags:

views:

answers:

How do you attach a click event to a jquery object created programmatically?

related questions