Смена картинки при нажатии на button

[Nexor]

Выручайте. Я не силен в javascript, но мне нужно реализовать одну небольшую фичу.

Есть кнопка спойлер "Принять участие" при нажатии на которую появляется форма комментирования. В другой части страницы, есть изображение.

<div id="girl">
<img src="/women.png" border="0" alt="" />
</div>

Мне нужно, чтоб при нажатии на кнопку "Принять участие" это изображение изменилось на другое и при этом работал спойлер.

Вот код самой кнопки со спойлером:

<div class="uSpoilerClosed" id="uSpoileraWRsRt"><div class="uSpoilerButBl"><input class="uSpoilerButton" onclick="if($('#uSpoileraWRsRt')[0]){if ($('.uSpoilerText',$('#uSpoileraWRsRt'))[0].style.display=='none'){$('.uSpoilerText',$('#uSpoileraWRsRt'))[0].style.display='';$('.uSpoilerButton',$('#uSpoileraWRsRt')).val('Оставьте комментарий');$('#uSpoileraWRsRt').attr('class','uSpoilerOpened');}else {$('.uSpoilerText',$('#uSpoileraWRsRt'))[0].style.display='none';$('.uSpoilerButton',$('#uSpoileraWRsRt')).val('Принять участие');$('#uSpoileraWRsRt').attr('class','uSpoilerClosed');}}" value="Принять участие" type="button"></div><div class="uSpoilerText" style="display: none;"><!--ust--><br><?if($COM_CAN_ADD$)?>
$COM_ADD_FORM$
<?else?>
<?if($USER_LOGGED_IN$)?><?else?><div align="center" class="commReg"><!--<s5237>-->Добавлять комментарии могут только зарегистрированные пользователи.<!--</s>--><br />[ <a href="$REGISTER_LINK$"><!--<s3089>-->Регистрация<!--</s>--></a> | <a href="$LOGIN_LINK$"><!--<s3087>-->Вход<!--</s>--></a> ]</div><?endif?>
<?endif?><!--/ust--><!--usn(=Title)--></div></div><br>

[madflash001]

В свой onclick на кнопке "Принять участие" добавьте

document.getElementById('girl').firstChild.src = 'НОВАЯ КАРТИНКА'

НОВАЯ КАРТИНКА заменить на адрес картинки, которая должна появляться при нажатии на кнопку.

[Nexor]

document.getElementById('girl').firstChild.src = 'НОВАЯ КАРТИНКА'

К сожалению не работает.

Сделал все как написано:

<div class="uSpoilerClosed" id="uSpoileraWRsRt"><div class="uSpoilerButBl">oile<input class="uSpoilerButton" onclick="if($('#uSpoileraWRsRt')[0]){if ($('.uSpoilerText',$('#uSpoileraWRsRt'))[0].style.display=='none'){$('.uSpoilerText',$('#uSpoileraWRsRt'))[0].style.display='';$('.uSpoilerButton',$('#uSpoileraWRsRt')).val('Оставьте комментарий');$('#uSpraWRsRt').attr('class','uSpoilerOpened');}else {$('.uSpoilerText',$('#uSpoileraWRsRt'))[0].style.display='none';$('.uSpoilerButton',$('#uSpoileraWRsRt')).val('Принять участие');$('#uSpoileraWRsRt').attr('class','uSpoilerClosed');}}document.getElementById('girl').firstChild.src ='/images/razdachy/women2.png'" value="Принять участие" type="button"></div><div class="uSpoilerText" style="display: none;"><!--ust--><br><?if($COM_CAN_ADD$)?>

[Nexor]

Других вариантов нет ?

[jsnb]

document.getElementById('girl').firstChild.src = 'НОВАЯ КАРТИНКА'

firstChild будет текстовым узлом. Можно заменить на children[0]. А лучше так:

document.querySelector('#girl>img').src = 'new_img_URL';

[Nexor]

document.querySelector('#girl>img').src = 'new_img_URL';

Отлично, работает Спасибо.