Read the fine manual...
The
.val()
method is primarily used to get the values of form elements such asinput
,select
andtextarea
.
You probably want .text()
I'd also add the delegation to your button, not the spans, ie
$(document).on('click', '#compute_total', function(e) {
e.preventDefault();
$('#total').val($('#room_rate').text() + $('#total_misc').text());
});