блоки с одинаковыми DIV названиями
 

у меня есть примерно такой код:

<div>
<div id="price_eur">
5 &euro;
</div>
<div id="price_usd">
8 $
</div>
<a href="javascript:changeCurrency();">change currency</a>
</div>

то есть, при нажатии на "change currency" javascript функция при помощи id="price_eur" и id="price_usd" прятает один div и показывает другой.

Проблема в том, что в случае нескольких таких блоков на странице появлятся div-и с одинаковыми id и функция не работает. То есть необходимо как то сделать так чтобы можна бьло доступаться к div только своего блока. Делать уникальный код для каждого блока возможности нет. Возможно ли как то это реализировать (не обязательно посредством id)?

Я так понял, структура может быть такой:

<div>
  <div id="price_eur">5 &euro;</div>
  <div id="price_usd">8 $</div>
  <a href="javascript:changeCurrency();">change currency</a>
</div>
<div>
  <div id="price_eur">5 &euro;</div>
  <div id="price_usd">8 $</div>
  <a href="javascript:changeCurrency();">change currency</a>
</div>

Тогда можно поступить так:

<div>
  <div>5 &euro;</div>
  <div>8 $</div>
  <a href="#" onclick="changeCurrency(this);">change currency</a>
</div>
<div>
  <div>5 &euro;</div>
  <div>8 $</div>
  <a href="#" onclick="changeCurrency(this);">change currency</a>
</div>

function changeCurrency(link){
  link.parentNode.getElementsByTagName('div')[0]; // Первый див
  link.parentNode.getElementsByTagName('div')[1]; // Второй див
  return false;
}

Более подробно читай тут