jQuery(document).ready(function($) { $('.workshop-day').click(function() { var day = jQuery(this).attr('data-day'); var day_name = $(this).find('.workshop-day-name .jet-listing-dynamic-field__content'); day_name = $(day_name).html(); var post = $(this).closest('.workshop'); var post_name = $(post).attr('data-postname'); var post_id = $(post).attr('id'); var key = post_id + '_' + day; var bookable = $(this).find('.workshop-day-bookable'); // Workshop bookable? if( bookable.length ) { // Toogle clicked class jQuery(this).toggleClass('selected'); // Form select field var select = $('form#workshop_reg .elementor-field-group-bookings .elementor-field-subgroup'); // Does form select option exist? var option = jQuery(select).find('input[value="'+key+'"]'); // selected? if( jQuery(this).hasClass('selected') ) { if( option.length == 0) { jQuery(select).append(' '+post_name+' '+day_name+''); } option = jQuery(select).find('input[value="'+key+'"]'); option.prop('checked', true); } else { if( option.length ) { option.prop('checked', false); } } // Sort $(select).find('.elementor-field-option').sort(function(a, b) { var sort_a = $(a).find('input').attr('value'); var sort_b = $(b).find('input').attr('value'); return sort_a.localeCompare(sort_b); }).appendTo(select); // Remove unselected + save selected var days = ""; $(select).find('.elementor-field-option').each(function(){ var opt = $(this); var opt_input = $(opt).find('input'); if (opt_input.prop('checked') != true) { opt.remove(); } else { days = days + $(opt).find('label').html() + ", "; } }); $("input#form-field-days").val(days); console.log(days); } }); });