onclick this jquery – How to bind onclick event to dynamically added HTML element with jQuery?

0
()

onclick this jquery using The click event occurs when an element is clicked. To trigger the onclick function in jQuery Example with demo.

onclick this jquery – How to get the ID of the clicked button using JavaScript / jQuery

The click() method triggers the click event. you can learn to how to call jQuery(this) from anchor tag onclick function.

jquery click function

$( "#selector_id" ).click(function() {
  alert( "Handler for .click() called." );
});

HTML Code:

index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Bind onclick event to dynamically added element - www.pakainfo.com</title>
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script type="text/javascript">
      // Put the jQuery all the bellow code Here
    </script>
  </head>
  <body>
    <p>Click the button below to dynamically add new items. You can remove it later.</p>
    <button>+ Add</button>
    <ul>
      <li>Tamilrokers NewLink</li>
      <li>Tamilrokers NewLink</li>
      <li>Tamilrokers NewLink</li>
    </ul>
  </body> 
</html>

jQuery Code:

$(document).ready(function(){
        //Add product
        $("button").click(function(){
          $("ul.example").append("<li>Tamilrokers NewLink <a href='javascript:void(0);' class='delete'>×</a></li>"); 
        });
        //Delete product
        $(document).on("click", "a.delete" , function() {
          $(this).parent().remove();
        });
});

how to call jQuery(this) from anchor tag onclick function?

Example

<li><a onclick="upcommingMovie(this);" href="javascript:void(0);">New NewLink</a></li>

function upcommingMovie(el) {      
       jQuery("#tree ul li").removeClass("selected");
       jQuery(el).closest('li').addClass("selected");
    }

Download

I hope you get an idea about jquery onclick function.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

Read Also:  how to hide div when click outside using jquery?

How useful was this post?

Click on a star to rate it!

Free Live Chat for Any Issue