Dymanic id html

i have multiple items with price field. for each ihave click here to reveal price. on clicking this the price for the clicked item should get revealed. but whichever one i click the price of the last enetered item gets revealed instead of the corresponding item one. i figured its because the id=‘price’ and id=‘price_ad’ are getting repeated multiple times. how do i get the id generated dynamically and target corresponding price of the clicked item. its for wordpress so i guess $post->id could be used but how…plzh help

<?php
    $itemprice = get_field('price',$post->id);
    ?>
<div class="clickbtn">
<span id="price" style="display:none"><?php echo $itemprice; ?></span>
<a id="price_ad" href="http://www.bookurl.com" onclick="show_price()" target="_blank">
   Click Here to reveal price
    </a></div>


<script>
   function show_price() {
       document.getElementById('price').style.display = '';
       document.getElementById('price_ad').style.display = 'none';
   }
</script>