Как parent() и closest() работают в jQuery?

Question

Я хочу просто добавить row стол за другим row когда последний нажимается, я использовал следующий код (на самом деле я использую этот код на странице visualforce).

function queryAndUpdateLead() { 
        var a = $('[id$=ibrahim]').closest('tr')
                .after('<tr><td>New Content 1</td><td>\
                        <a href="#">New Content 2</a></td></tr>');
}

Проблема здесь в том, что эта строка добавляется после всех существующих строк в таблице, и когда я использовал length свойство для проверки количества элементов в a Я получаю всегда 2 (у меня изначально 2 ряда)

alert('a.length') // this shows 2 

Я хочу получить только прямую родительскую строку, а не все существующие строки, но я не знаю, почему она не работает?

РЕДАКТИРОВАТЬ: HTML-КОД, ПРЕДОСТАВЛЯЕМЫЙ СЕРВЕРОМ SALESFORCE:

<tbody id="j_id0:j_id3:j_id4:j_id6:tb">
<tr class="dataRow even first" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}" onmouseout="if (window.hiOff){hiOff(this);} " onmouseover="if (window.hiOn){hiOn(this);} ">
**<td id="j_id0:j_id3:j_id4:j_id6:0:ibrahim" class="dataCell " onclick="queryAndUpdateLead();" colspan="1">**
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id7" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id8" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id9" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id10" class="dataCell " colspan="1">
</tr>
<tr class="dataRow odd last" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}" onmouseout="if (window.hiOff){hiOff(this);} " onmouseover="if (window.hiOn){hiOn(this);} ">
<td id="j_id0:j_id3:j_id4:j_id6:1:ibrahim" class="dataCell " onclick="queryAndUpdateLead();" colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id7" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id8" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id9" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id10" class="dataCell " colspan="1">
</tr>
</tbody>
</table>

Answer 1

Как у вас есть коллекция $('[id$=ibrahim]') элементы, вам нужно использовать $(this) найти ближайший tr текущего элемента и вставьте его после:

function queryAndUpdateLead() { 
        var $(this).closest('tr')
                .after('<tr><td>New Content 1</td><td>\
                        <a href="#">New Content 2</a></td></tr>');
}