2

I have this code on my jquery

 participantText += '<div class="wrap_col td7"><input type="image" src="/pc/images/callgray.png" style="vertical-align: middle" class="actionInvite"></div>';

This is the action of class actionInvite

$(".actionInvite").click(function(){
    alert("Hello World");
});

but when i click the button it doesn't alert "Hello World".

It's just reload the page.

Improve this question
4
  • 4
    Try $(document).on('click', '.actionInvite', function(){... Commented Sep 3, 2015 at 1:44
  • 1
    use delegate function $(".wrap_col").on('click', '.actionInvite', function(){ Commented Sep 3, 2015 at 1:44
  • 1
    @TamilSelvan .wrap_col is added dynamically too. Commented Sep 3, 2015 at 1:51
  • possible duplicate of Event binding on dynamically created elements? Commented Sep 3, 2015 at 1:55

2 Answers 2

Reset to default
4

You html is dynamically assigned.

For dynamic content

Try like this 

$(document).on("click",".actionInvite",function(){
    alert("Hello World");
});
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

1

The image input type is actually a submit button (thus the reload). If you must use it, then you need to do this on your class or somewhere in your form submit event handler:

$(".actionInvite").closest('form').submit(function(e){
   e.preventDefault();
   alert("Hello World");
});

With html5 and modern CSS, I'd totally forgotten that input type actually exists. I'm sure a cleaner, better solution is out there on the horizon of your mind.

here's a jsfiddle for it.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.