Getting the previous sibling of an element using JQuery

Question

I have a page where i have multiple textboxes followed by a "browse" link, like this:

[textbox1] Browse
[textbox2] Browse
[textbox3] Browse

Now I want to know which textbox's browse link I pushed. I want to set a global variable (how to do that in Javascript/JQuery?) and save the textbox, or at least the class/id/name of the textbox so that I know which textbox to manipulate from the browse routing.

I don't know the id or anything of the textbox since this is generated at run time. All I know is that it's the previous sibling to the browse link.

EDIT: Cant get it to work, this is my jquery method, just for testing it:

$(document).ready(

function() { $('#BrowseLink').click( function() { alert($(this).prev('input[type=text]').attr('id')); return false; } ); });

it makes an alert saying "undefined"...

This is my markup on the page:

<input id="Image"  name="Image" width="5px" type="text" value=""></input>&nbsp;<a id="BrowseLink" href="#">Browse</a>

EDIT EDIT Looking at my markup i solved it, the nbsp; is an entity aswell, hence the need for prev().prev()

Answer 1

You can use the .prevAll() method:

someGlobal = $(this).prevAll('input[type=text]:last').attr('id');

To make a global variable, just don't use var when you "declare" / initialise it.

Answer 2

// attach a click handler to all of the browse links
$('a.someClassThatAllBrowseLinksAreMarkedWith').click(function() {
    var associatedTextBoxValue = $(this).prev('input[type=text]').val();
    // TODO: do something with the value
    return false;
});