jquery Find TD of TR with Class and make changes (for a Telerik MVC grid)

Question

this is my mark up

<tr class="t-detail-row">
    <td class="t-hierarchy-cell"></td>           
    <td class="t-detail-cell" colspan="5"></td>
</tr>

I want to find the tr with class t-detail-row and remove the child td with class t-hierarchy-cell and change the colspan of td with class t-detail-cell

I tried something like this

var newcolspan = $(e.row).find('.t-detail-row').children('td.t-detail-cell').attr('colspan');

$(e.row).find('.t-detail-row').children('td.t-hierarchy-cell').remove()
.children('td.t-detail-cell').attr('colspan',newcolspan+1);

any help would be greatly appreciated.

More Specific Details about the situation

---

Hi, How can i call client jquery Function when grid expand is fired.

all that i want to achieve is. when we expand the Telerik MVC grid we get this mark up in detail row

<tr class="t-detail-row">
<td class="t-hierarchy-cell"></td>
<td class="t-detail-cell" colspan="5"></td>
</tr>

i want to eliminate <td class="t-hierarchy-cell"></td> in it.

and get the mark up as

<tr class="t-detail-row">
<td class="t-detail-cell" colspan="Current+1"></td>
</tr>

for this i though of doing some thing like this

on grid expand event, if i can call a jquery function then because i wont have the detail-row markup generated until we expand the grid

function onExpandingtheGrid(){
$('tr.t-detail-row').find('td.t-hierarchy-cell').remove();
$('tr.t-detail-row').find('td.t-detail-cell').attr('colspan',newcolspan+1);
}

Thanks

Solution

---

just add this line in your telerik code

.ClientEvents(exp => exp.OnDetailViewExpand("onExpandingtheGrid"))

and rest as mentioned in your above jquery function yahoo!

Answer 1

with separate functions its:

$('tr.t-detail-row').find('td.t-hierarchy-cell').remove();
$('tr.t-detail-row').find('td.t-detail-cell').attr('colspan',newcolspan+1);

i used find in this case because it looks like you are trying to use a target row for a click or something. replace the tr selector with your target if that is the case.

Answer 2

Try this:

$('tr.t-detail-row td.t-hierarchy-cell').remove();
$('tr.t-detail-row td.t-detail-cell').attr('colspan', X); // replace X with desired colspan value