Движение обьекта, влево вправо вверх вниз на JavaScript

[Brick]

<span id="4">✉</span>

<span onClick="up()">↑ВВЕРХ↑</span>
<br>
<span onClick="left()">←ВЛЕВО</span>
| <span onClick="right()">ВПРАВО→</span>
<br>
<span onClick="down()">↓ВНИЗ↓</span>

ситуация , такая, как сделать , чтоб при нажатии на вверх, вних, влево или вправо, объект , который находится в id=4, смещался бы на 4px в ту или иную сторону?

обьект в id=4, любой: картинка, текст ...

и где посмотреть информацию на подобную тематику?

[Brick]

можно пожалуйста очень простой пример

[Brick]

document.getElementById("4").style.position.left+= 4;
?

[Rise]

<div id="street" style="position:relative;">
    <div id="man" style="position:absolute;left:0px;top:0px;">O</div>
</div>
<script>
function left() {
    man.style.left = parseInt(man.style.left) - 4 + 'px';
}
</script>

[Brick]

спасибо