我试图弄清楚为什么“删除小时数”按钮在我的表单中不起作用。我有一个带有“添加小时数”按钮的选择菜单。当按下“添加小时数”按钮时，它会创建带有几个s的几个，其中之一是删除。具有删除功能的跨度不起作用。我在该函数中设置了一个警报，该警报未执行。 jQuery文件/ cdn已正确链接，其他按钮（添加时间）正常工作。
HTML
<% layout('layouts/boilerplate') -%>
<div class="container-fluid">
<div class="row">
<div class="col-6 form-group">
<h1>New Post</h1>
<form action="/posts" method="POST" enctype="multipart/form-data">
<div class="form-group"><textarea name="post[description]" placeholder="Description"></textarea></div>
<div class="form-group"><input class="form-control" type="text" name="post[location]" placeholder="Location"></div>
<div id="output"></div>
<div class="row">
<div class="col-12">
<select id='day' >
<option value="Mon">Mon</option>
<option value="Tue">Tue</option>
<option value="Wed">Wed</option>
<option value="Thu">Thu</option>
<option value="Fri">Fri</option>
<option value="Sat">Sat</option>
<option value="Sun">Sun</option>
</select>
<select id='hourStart'>
<option value="0 0.0">12:00 am (midnight)</option>
<option value="0 0.5">12:30 am</option>
<option value="0 1.0">1:00 am</option>
<option value="0 1.5">1:30 am</option>
<option value="0 2.0">2:00 am</option>
<option value="0 2.5">2:30 am</option>
<option value="0 3.0">3:00 am</option>
<option value="0 3.5">3:30 am</option>
<option value="0 4.0">4:00 am</option>
<option value="0 4.5">4:30 am</option>
<option value="0 5.0">5:00 am</option>
<option value="0 5.5">5:30 am</option>
<option value="0 6.0">6:00 am</option>
<option value="0 6.5">6:30 am</option>
<option value="0 7.0">7:00 am</option>
<option value="0 7.5">7:30 am</option>
<option value="0 8.0">8:00 am</option>
<option value="0 8.5">8:30 am</option>
<option value="0 9.0">9:00 am</option>
<option value="0 9.5">9:30 am</option>
<option value="0 10.0">10:00 am</option>
<option value="0 10.5">10:30 am</option>
<option value="0 11.0">11:00 am</option>
<option value="0 11.5">11:30 am</option>
<option value="0 12.0">12:00 pm(noon)</option>
</select>
<select id='hourEnd' >
<option value="0 0.0">12:00 pm (noon)</option>
<option value="0 0.5">12:30 pm</option>
<option value="0 13.0">1:00 pm</option>
<option value="0 13.5">1:30 pm</option>
<option value="0 14.0">2:00 pm</option>
<option value="0 14.5">2:30 pm</option>
<option value="0 15.0">3:00 pm</option>
<option value="0 15.5">3:30 pm</option>
<option value="0 16.0">4:00 pm</option>
<option value="0 16.5">4:30 pm</option>
<option value="0 17.0">5:00 pm</option>
<option value="0 17.5">5:30 pm</option>
<option value="0 18.0">6:00 pm</option>
<option value="0 18.5">6:30 pm</option>
<option value="0 19.0">7:00 pm</option>
<option value="0 19.5">7:30 pm</option>
<option value="0 20.0">8:00 pm</option>
<option value="0 20.5">8:30 pm</option>
<option value="0 21.0">9:00 pm</option>
<option value="0 21.5">9:30 pm</option>
<option value="0 22.0">10:00 pm</option>
<option value="0 22.5">10:30 pm</option>
<option value="0 23.0">11:00 pm</option>
<option value="0 23.5">11:30 pm</option>
<option value="1 0.0">12:00 am (midnight next day)</option>
<option value="1 0.5">12:30 am (next day)</option>
<option value="1 1.0">1:00 am (next day)</option>
<option value="1 1.5">1:30 am (next day)</option>
<option value="1 2.0">2:00 am (next day)</option>
<option value="1 2.5">2:30 am (next day)</option>
<option value="1 3.0">3:00 am (next day)</option>
<option value="1 3.5">3:30 am (next day)</option>
<option value="1 4.0">4:00 am (next day)</option>
<option value="1 4.5">4:30 am (next day)</option>
<option value="1 5.0">5:00 am (next day)</option>
<option value="1 5.5">5:30 am (next day)</option>
<option value="1 6.0">6:00 am (next day)</option>
</select>
<button id="addHours" type="button" value="submit" >Add Hours</button>
</div>
</div>
<input class="btn btn-primary mb-2" type="submit">
</form>
</div>
</div>
</div>
JQUERY
$('#addHours').on('click', function(){
const day = $('#day option:selected').text();
const hourStart = $('#hourStart option:selected').text();
const hourEnd = $('#hourEnd option:selected').text();
//creates a div and assigns it to a variable
var div = $('<div/>').attr("class", "display-hours");
//create spans and assign it to a variable
var spanDay = $("<span> </span>").text(day);
var spanHourStart = $("<span> </span>").text(hourStart);
var spanDash = $("<span> </span>").text("-");
var spanHourEnd = $("<span> </span>").text(hourEnd);
var remove = $('<span></span>').attr('class', 'remove-hours').text('REMOVE')
var input = $('<input>').attr({
type: 'hidden',
value: [day, hourStart, hourEnd],
name: 'post[{day:day, hourStart:hourStart, hourEnd:hourEnd}]'
});
//adds div w hours to output
$('#output').append(div);
$(div).append(spanDay, spanHourStart, spanDash, spanHourEnd, remove, input)
});
//removes the div for hours
$('.remove-hours').click(function(){
$(this).alert('working')
$(this).parent().remove();
})