McKeene McKeene - 3 months ago 8
jQuery Question

Calculate and display multiple integer inputs with jQuery

I am trying to learn jQuery and is trying to create a page where people can order tickets. I have two different ticket types with a select input for each. I would like to calculate and display the number of total tickets selected.

Here are my jQuery code:

$(document).ready(function(e) {
$("select").change(function() {
var numberOfTickets = 0;
$("select.tickets-selection").each(function() {
numberOfTickets = numberOfTickets + parseInt($(this).val());
})
$(".ticket-subtotal p.amount").val(numberOfTickets);
});
});


For the HTML please check my JDFiddle: https://jsfiddle.net/mckeene/975Lsvdn/3/

Answer

You should use html method instead of val:

$(".ticket-subtotal p.amount").html(numberOfTickets);

val is only for inputs.

jsFiddle