How do I hide a parent element using jquery?

Question

Suppose the following HTML:

<li class="fooli">
   <a class="foo" href="javascript:foo(this);">anchor</a>
</li>
<li class="fooli">
   <a class="foo" href="javascript:foo(this);">anchor</a>
</li>

and the following Javascript (using jquery 1.3.2):

function foo(anchor) {
  alert($(anchor).attr('href'));
}

My goal is to be able to hide the li that is clicked on, but I can't assign them unique ids. Thus, I want to do it positionally (i.e. identify the particular anchor clicked on) by something like $(anchor).parent().hide().

However, the alert above returns "undefined", so it's not obvious to me that I even have the right jquery object.

How do I figure out what object $(anchor) is? In particular, how do I see what attributes it has, what class it has, what HTML element it is, etc?

Answer 1

Can't you do this:

$(function() {
  $("a.foo").click(function() {
    $(this).parent().hide();
    return false;
  });
});

with:

<li class="fooli"><a class="foo" href="#">anchor</a></li>
<li class="fooli"><a class="foo" href="#">anchor</a></li>