JQuery get position of the clicked button in a gridview
===

I'm quite new to JQuery, made some progress but now in a corner, so would greatly appreciate a nudge in the right direction. 

I have an asp.net gridview (within an update panel) which can contain any number of rows. On each row I have a couple of databound labels showing a product price and code, also on the row I have an imagebutton. What I'm trying to do is when the button is clicked to display some of the row data in a faded in Div to the right of the button. So that a user is informed of an item being added to a cart for example.

I've got as far as reading the row data and fading in the div with the row information. But struggling to get the clicked buttons position so I can reposition the Div next to the appropriate button.

Here's some code:

Code behind:

    protected void Page_Load(object sender, EventArgs e)
    {
    if (!Page.IsPostBack) 
    { 
        DataTable dt = new DataTable(); 
        dt.Columns.AddRange(new DataColumn[3] { new DataColumn("Item"), new DataColumn("Price"),   new     DataColumn("Code") }); 
        dt.Rows.Add("Shirt", 200, "abc"); 
        dt.Rows.Add("Football", 30, "xyz"); 
        dt.Rows.Add("Bat", 22.5, "sym"); 
        GridView1.DataSource = dt; 
        GridView1.DataBind(); 
    }
}



Markup: I've removed the update panel, to reduce the code size.

    <%@ Page Title="" Language="C#" MasterPageFile="~/Master.master" AutoEventWireup="true"
        CodeFile="test.aspx.cs" Inherits="test" %>
    
    <asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
        <script type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
        <link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/start/jquery-ui.css"
            rel="stylesheet" type="text/css" />
    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="Main" runat="Server">
    <script type="text/javascript">

        function pageLoad() {
            $("[id*=lnkSelect]").live("click", function () {

                //Get the values
                var code = $("#code").html($(".code", $(this).closest("tr")).html());
                var price = $("#price").html($(".price", $(this).closest("tr")).html());

                //Build the new HTML
                $(code).prepend("<br/>Item: ");
                $(code).append("<br/>Has been<br/>added to your cart.");
                $(code).append("<br/>Price: ");
                $(code).append(price);
                $(".tooltipleft").html(code); //Set the new HTML
                $(".tooltipleft").fadeIn("slow").fadeOut("slow"); //Show the div

                return true;
            });

        };
    </script>
            <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
                <Columns>
                    <asp:BoundField DataField="Item"/>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Label ID="lblPrice" runat="server" ForeColor="DimGray" CssClass="price" Text='<%# Eval( "Price") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Label ID="lblCode" runat="server" ForeColor="DimGray" CssClass="code" Text='<%# Eval( "Code") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:ImageButton ID="lnkSelect" runat="server" ImageUrl="~/Buttons/add_to_cart.png"
                                AlternateText="Add To Cart" ImageAlign="Right" CssClass="buttontag" />
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
        <div class="tooltipleft" id="tooltip">
        </div>
    </asp:Content>

Would appreciate any help.

Cheers

CM