Estoy trabajando en un proyecto con Django. Tengo varios botones en una página. Al hacer clic en uno de estos botones, quiero obtener el valor sin que se actualice la página.

Con el siguiente código, quiero, quiero, excepto que solo devolverá el valor del primer botón en la página, independientemente del botón en el que haga clic.

Tenga en cuenta que no tengo experiencia con JS, por eso estoy luchando. He mirado en muchos, muchos hilos y no puedo resolverlo.

 <article class="media content-section"> <div class="media-body"> <div class="article-metadata"> <h2>{{ ingredient.group }}</h2> </div> <button id="{{ ingredient.pk }}" class="testing" value="{{ ingredient.food_name }}">{{ ingredient.food_name }}</button> </div> </article>

 $(document).on('click', '.testing', function(e) { e.preventDefault(); $.ajax({ type: 'POST', url: '{% url "select" %}', data: { value: $('.testing').val(), csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val(), // action: 'post', success: function(json) { console.log("success"); // another sanity check console.log($('.testing').val()) }, } }) })