$(document).on('click', '.add_service', function() {
var divform = $(document.createElement('div'));
var divcol1 = $(document.createElement('div'));
var divcol2 = $(document.createElement('div'));
var inputselect = $(document.createElement('select'));
var deletebutton = $(document.createElement('span'));
var icon = $(document.createElement('i'));
inputselect.addClass('form-control');
divform.addClass('row form-group');
divcol1.addClass('col-1');
divcol2.addClass('col-11');
inputselect.attr('name', 'service_id[]');
inputselect.attr('id', 'serviceDat');
$('#addserv').append(divform);
divform.append(divcol1);
divform.append(divcol2);
divcol2.append(inputselect);
deletebutton.addClass('btn btn-danger pull-right deleteserv');
icon.addClass('fa fa-trash');
divcol1.append(deletebutton);
deletebutton.append(icon);
$.get("{{ route('data.services') }}", function(data, status) {
for (i in data.services) {
var inputoption = $(document.createElement('option'));
inputoption.val(data.services[i].id);
inputoption.text(data.services[i].name + ' $'+ data.services[i].cost);
inputselect.append(inputoption);
}
});
});
$(document).on('click', '.deleteserv', function() {
$(this).closest('.form-group').remove();
});