accessing div inside the td using jquery

not sure why I find this so difficult. Here is the html code:

<tr>
    <td>FirstName 9</td>
    <td>LastName 9</td>
    <td><a href="#" id="linkSponsorMessage">View</a></td>
    <td>
        <div class="divSponsorMessage" style="display:none">
            Greetings FirstName 9, LastName 9!
        </div>        
    </td>
</tr>

I need开发者_JS百科 to access the <div> when click on the anchor link using JQuery.

UPDATE:

I got to work:

$("#linkSponsorMessage").parent("td").next("td").children("div")

But is there a better way!!!

UPDATE 2:

Also, since I am using multiple DIVS and anchor tags I had to do $(this) to refer to the current anchor tag that was triggered.

$(document).ready(function() 
{
    $("a").mouseover(function()     
    {
        var divs = $(this).closest("tr").find("div").fadeIn("slow"); 

    });

    $("a").mouseout(function()     
    {
        var divs = $(this).closest("tr").find("div").fadeOut("slow"); 

    });


});

You can use this:

$("#linkSponsorMessage").closest("tr").find("div")

or:

$("#linkSponsorMessage").closest("tr").find(".divSponsorMessage")

Just use

$("a").click(function(){alert("clicked");return false;};)

The above code would show an alert clicked and would not allow the default functionality of link click to happen.

Hope this helps.

scrap my original answer if you have multiple div messages.... thought you used an id for both the link and the div

look at Nick Craver's answer on how to find the div by proximity ..

[original answer]

Since you use IDs for each element it is very straight-forward to access anything.. here is some sample code..

$('#linkSpnsoMessage').click( function(){
   var $div = $('.divSponsorMessage');
    //$div variable now holds the jquery version of the div..
} );

try this

 $(td a).click(function(){
  alert('hello');
   return false;
 });

$('div.divSponsorMessage');