Поворот изображения при клике на ссылку

[_marisha]

Доброго времени суток!
На сайте есть кнопка, при клике на которую раскрывается содержимое.

<div >
    <a href="#" id="link" class="param" onclick="toggle(hidden_content)">Раскрытие/скрытие содержимого
        <span class="arrow"></span>
    </a>
</div>

function toggle(el) {
        el.style.display = (el.style.display == 'none') ? '' : 'none'
    }

span class="arrow" это изображение со стрелкой (изначальное положение скрин "Стрелка вниз")
.arrow
{
	float: right;
	margin-top: 0px!important;
	width: 80px;
	height: 80px;
	background: url(/images/select_white.png) center no-repeat #219e82!important;
}

Необходимо, при клике на кнопку переворачивать изображение со стрелкой (скрин "Стрелка вверх") с раскрытием содержимого. При повторном нажатии на кнопку обратно переворачивать изображение со стрелкой и сворачивать содержимое.
Подскажите, пожалуйста, как на основании кода function toggle(el) произвести переворот стрелки. Спасибо.

[j0hnik]

function toggle(el) {
        el.style.display = (el.style.display == 'none') ? '' : 'none'
var elt = document.querySelector('.arrow')
elt.style.transform = elt.style.transform == "rotate(180deg)"?"rotate(0deg)":"rotate(180deg)";
}

[_marisha]

j0hnik, спасибо что откликнулись
100% попадание, супер!!!
Огромнейшее спасибо

[ruslan_mart]

.arrow--active {
   transform: scaleY(-1);
}

function toggle(el) {
    el.style.classList.toggle('arrow--active');
}