<!DOCTYPE html>
<html>
<head>
<title>imgOnclick</title>
<meta charset="utf-8">
</head>
<body>
<div id="img">
<img src="img/good1.jpg" height="200px">
</div>
<button id="b1" value="1" onclick="buttonSelected(this)">Велосипеды</button>
<button id="b2" value="2" onclick="buttonSelected(this)">Запчасти</button>
<button id="b3" value="3" onclick="buttonSelected(this)">Аксессуары</button>
</body>
<script>
var bt1=document.querySelector('#b1');
var bt2=document.querySelector('#b2');
var bt3=document.querySelector('#b3');
var img=document.querySelector('#img');
bt1.onclick=function buttonSelected(){
img.innerHTML='<img src="img/good1.jpg" height="200px">';
bt1.style.color="#F00";
bt2.style.color="";
bt3.style.color="";
}
bt2.onclick=function buttonSelected(){
img.innerHTML='<img src="img/good2.jpg" height="200px">';
bt1.style.color="";
bt2.style.color="#F00";
bt3.style.color="";
}
bt3.onclick=function buttonSelected(){
img.innerHTML='<img src="img/good3.jpg" height="200px">';
bt1.style.color="";
bt2.style.color="";
bt3.style.color="#F00";
}
</script>
</html>