Как я могу получить элемент, родственный в JQuery, в функции?

Я пытаюсь установить элемент с тем же значением, что и его родной брат в JQuery.

У меня есть таблица с несколькими полями, и когда я нажимаю кнопку "Изменить", я хочу скопировать значение метки в соседнее поле ввода:

<table style="width:90%">
  <tr>
    <td>Start</td>
    <td>
       <span ID="lblSprintStart" class="staticField">01/01/2001</span>
       <input class="editableField" id="sprintStart" />
    </td>
   </tr>
   <tr>
     <td>End</td>
     <td>
       <span ID="lblSprintEnd" class="staticField">02/02/2002</span>
       <input class="editableField" id="sprintEnd" />
     </td>
    </tr>
 </table>
<button id="editButton">Edit</button>

Я могу сделать это, нацеливая каждый отдельный элемент по ID:

$(function () {
 $("#editButton")
  .click(function (event) {
   event.preventDefault();
   editMode();
 }); 
});

function editMode() {     
  $("#sprintStart").val($("#sprintStart").siblings(".staticField").html());
}

Но я хочу сделать это по классу, чтобы все поля были обновлены. Если я изменю функцию, чтобы использовать селектор $ (this) и делать это по классу, он не работает:

function editMode() {     
   $(".editableField").val($(this).siblings(".staticField").html());
}

http://jsfiddle.net/QQLvX/1/