Как удалить имя класса из lastChild элемента, используя EXTJs

Question

Это может быть очень легко взломать, но я просто не могу заставить это работать: я хочу удалить класс из дочернего узла: я обращаюсь к последнему ребенку, как показано ниже: code:

Ext.select(".item").elements[0].lastChild

o / p:

<table class="abc test hide test123">
  <tbody>
      <tr>
         <td></td>
     </tr>
  </tbody>
</table>

Я хочу удалить class="hide "и заменить его на class="show", поэтому будет отображаться:

<table class="abc test show test123">
      <tbody>
          <tr>
             <td></td>
         </tr>
      </tbody>
    </table>

здеськак выглядит вся структура:

<div class="item">
   <div></div>
<div class="abc test hide"></div>
<div class="abc5643"></div>
<div class="abide"></div>
<table class="abc test hide test123">
   <tbody>
              <tr>
                 <td></td>
             </tr>
          </tbody>
</table>
</div>

поэтому <table> является последним ребенком родительского класса item.

как я могу это сделать?

Answer 1

с ExtJS это работает аналогично (по сравнению с манипулированием DOM с JS):

Ext.select(".item > *:last-child").removeCls("hide").addCls("show");

^, которое рекомендуется только при работе с простой разметкой HTML, а не с компонентами ExtJS.

Answer 2

Это FIDDLE

После замены: