as I do so that all the buttons have the same classes in javascript [closed]

I want to show the div id="comment", but having a foreach with many comments only works for the first button, the other buttons do not work. I think xq is the id is unique, so I imagine that with javascript handle a class so that all the buttons have the same functionality .... that when I click on the answer to show the div I want to show. Something like in the classes in css. I appreciate the help. Thank you very much.

  <button id="responder" class="botonverde" data-toggle="collapse">Responder</button>
  <div id="comentar" class="col col-xs-3 col-xs-offset-2"    style="display:none;" >

    <textarea rows="2" cols="50" placeholder="añadir comentario"></textarea><br>
    <button class="botonrojo">Enviar</button>
    <button id="cancelar" class="botonverde">Cancelar</button>
 </div>

Javascript code:

function cancelar() {  
    $('#comentar').hide();
}

function responder() {
    $('#comentar').show();
}


$(document).ready(function () {

    $('#cancelar').click(cancelar);
    $('#responder').click(responder);


});