CODEWITHSUNDEEP
jquery
trying_hal9000
trying_hal9000

Reputation: 4403

jQUERY: nothing happens with .click(function() where am I going wrong?

Still learning jquery here and I've tried to setup a set of divs that expand and then close, however nothing is happening on the close. Can someone explain what I'm doing wrong?

http://jsfiddle.net/N6Jkw/

Thanks!

Upvotes: 1

Views: 1315

Answers (3)

Gabriele Petrioli
Gabriele Petrioli

Reputation: 196236

You are dynamically adding the span.close element.

So you need to use the .live method to bind the events..

$("span.close").live('click', function() {
    $(this).parent('.post-big').hide();
    $(this).parent().prev().show();       
   });

Also note that i used prev as there is no next element (and you seem to want to bring back the one you close earlier..)..

working demo at http://jsfiddle.net/gaby/N6Jkw/1/

Upvotes: 1

gen_Eric
gen_Eric

Reputation: 227310

When you bind to $("span.close"), the <span> is not in the DOM yet. Try using .live() here.

$("span.close").live('click', function() {
  $(this).parent('.post-big').hide();
  $(this).parent().next().show();       
});

Upvotes: 0

Alex Peattie
Alex Peattie

Reputation: 27697

Your .close <div>s are created dynamically, so you need to use .live - this will assign the click handler to every new <div> that's added to the DOM. See:

http://api.jquery.com/live/

$("span.close").live("click", function() {
   $(this).parent('.post-big').hide();
   $(this).parent().next().show();       
});

Upvotes: 3

Related Questions