Passing a self object in jquery

Question

In the below code how to pass the div object inside validate function

  <div><input type="text"></input>&nbsp;&nbsp;&nbsp&nbsp;<a href="#" onclick="validate("Hot to pass the div objevt here")"</input> 

   <script>
    function validate()
    {
      .....
      .....
       Finally remove the div   
    }

     </script>

Answer 1

HTML:

<div class='elementToRemove'>
    <div>
        <a href="#" onclick="validate(this)">some text</a>​​​​​​​​​​​​​​​​​​​​​​​
    </div>
</div>

javascript:

function validate( elem ) {
    $(elem).closest('div.elementToRemove').remove();
}

In the validate() function, elem will represent the <a> element that received the event.

Then you can wrap it in a jQuery object, and use .closest() to get the first <div> ancestor, and use .remove() to remove it from the DOM, and clean up any data attached, like event handlers.

Or perhaps preferable to have jQuery take care of your event handlers:

HTML:

<div class='elementToRemove'>
    <div>
        <a href="#" class="someClassName">some text</a>​​​​​​​​​​​​​​​​​​​​​​​
    </div>
</div>

jQuery:

$('a.someClassName').click(function() {
    $(this).closest('div.elementToRemove').remove();
});

Answer 2

<div>  blah blah <a href="#" id="remove" > Delete </a>   blah blah </div>

$(function() {
 $('a#remove').click(fnuction() {
     $(this).closest('div').remove();
 });
});