jQuery How to set the value to previous input element?

Question

Here is the code I have

<input type="text" value="Select" class="inputClass"></input>
<div class="divClass">
<table>
    <tr><td>Value1</td></tr>
    <tr><td>Value2</td></tr>
</table>
</div>

I want to set the value of input field when the user clicks on a tr and I am doing something like this:

$("tr").click(function() {
  $(this).parent("div.divClass")
   .prev("input.inputClass")
   .val("SomeValue");    
});

But it is not working. Here is the link to the fiddle -> Fiddle

Can anyone tell me where am I going wrong?

Answer 1

The parent() method returns the direct parent element of the selected element.

You can try this:

$("tr").click(function() {
  $(this).closest("div.divClass").prev("input.inputClass").val("SomeValue");    
});

Answer 2

You could just add an id field to the input element and avoid moving up and down the DOM.

and then do something like this:

$("td").click(function() {
  $('#input').val($(this).text());    
});