Zmiana ikony po klikaniu na przycisk Opcje

[PiterEL]

Witam
Jestem początkujący ale to naprawdę początkujący. Mam prośbę.
Mam taki kod przycisku pokazywania i ukrywania hasła. Ma on przypisaną ikonę 'eye' gdzie scieżka do ikony jest zapisana w pliku ext.css

.eye {
background-image: url(../icons/eye.png) !important;
}



Chciałbym dorobić do tego przycisku że jak klikam w niego to zmienia sie ikona. Czyli najpierw jest napis na przycisku show password i ikona o nazwie show_pass.png a jak w niego klikam to przycisk ma napis Hide password i ikona wtedy się zmieni na hide_pass.png

Postać scieżki do ikon w pliku ext.css to są takie:



.showPass{
background-image: url(../icons/show_pass.png) !important;
}

.hidePass{
background-image: url(../icons/hide_pass.png) !important;
}



A to kod przycisku obecnie w pliku idnode.js:


if (conf.hidepwd) {
buttons.push('-');
abuttons.add = new Ext.Toolbar.Button({
tooltip: 'Show or hide passwords',
iconCls: 'eye',
text: 'Show passwords',
disabled: false,
handler: function() {
conf.showpwd = !conf.showpwd ? true : false;
this.setText(conf.showpwd ? 'Hide passwords' : 'Show passwords');
roweditor_destroy();
roweditor(select.getSelected());
}
});
buttons.push(abuttons.add);
}



Dopisałem takie coś ale jednak źle strzelam bo nie działa:


if (conf.hidepwd) {
buttons.push('-');
abuttons.add = new Ext.Toolbar.Button({
tooltip: 'Show or hide passwords',
//iconCls: 'eye',
text: 'Show passwords',
disabled: false,
handler: function() {
conf.showpwd = !conf.showpwd ? true : false;
this.setText(conf.showpwd ? 'Hide passwords' : 'Show passwords');
roweditor_destroy();
roweditor(select.getSelected());
function iconpwd() {
if (conf.showpwd == false) {
iconCls: 'showPasswords';
conf.showpwd = true;
} else {
iconCls: 'hidePasswords';
conf.showpwd = false;
}
}
}
});
buttons.push(abuttons.add);
}


Bardzo proszę o pomoc.