JQuery: Using $ (this) internal functions?

Question

Is there a way to use $(this)inside jQuery functions?

HTML

<ul>
  <li class="delete"><a onclick="deletePerson(12);" href="">Delete</a></li>
</ul>

JQuery

function deletePerson(id) {
  $(this).parent().remove(); // doesn't work
  // [...]
  return false;
}

Answer 1

You can use .call()to set the value thisas you wish.

<a onclick="deletePerson.call( this, 12 );" href="">Delete</a>

Now the deletePersonfunction thiswill be an element.

function deletePerson(id) {
  $(this).parent().remove(); // will work
  // [...]
  return false;
}

Answer 2

Pass the link as a parameter:

<ul>
  <li class="delete"><a onclick="deletePerson(this, 12);" href="">Delete</a></li>
</ul>

function deletePerson(link, id) {
  $(link).parent().remove(); 
  // [...]
  return false;
}

Answer 3

You do not need to have JS in the link itself, since you are using JS.

HTML

<ul>
    <li class="delete"><a onclick="deletePerson(12);" href="">Delete</a></li>
</ul>

JQuery

$('.delete').find('a').bind('click', function() {

    $(this).parent().remove();
    return false;

});