Is there a tool to get names and values of XHTML Nodes ?

[gimme_this_gimme_that]

I have an XHTML page which has divs whose contents I want to change
dynamically based upon cookie settings.

Say, this would be the XHTML ...

<div id="_nav" class="help-links" >
<ul>
<li><a id="_search" href="">Search</a></li>
</ul>
</div>

And this would be Javascript that dynamically changes the value of a
link on the page:

function setSearchLink() {
var fn = document.getElementById("_search")
var user_type = getCookieData("UserType");
if (user_type) {
if ("LikesYahoo" == emp_type) {
fn.childNodes[0].data = "Yahoo";
fn.attributes["href"].nodeValue = "http://www.yahoo.com";
} else {
fn.childNodes[0].data = "Google";
fn.attribues["href"].nodeValue = "http://www.google.com";
}
}
}

I'm having trouble isolating element data values and attribute values.
It's kind of hit and miss.

Is there a tool that allows me to me load an XHTML file, lets me to
click on the HTML ( say around the Search element or the href
attribute ) and then shows me the XPath of what I just clicked?

In the above example, I'd like to refer to things from the id "_nav"
instead of from "_search".

Thanks.