изменение атрибута
 

Здравствуйте, я работаю с атрибутом option selected
при нажати на группу кнопках нужно удалит все выставление selected в option и доварить к определенному selected, при первом нажати все работает хорошо но если например нажимаем первую кнопку патом трети потом еще рас первый то в htlm все нормально selected вставляется а вывод сбрасывается в первый option

$(document).on('click', '.menu_edit', function(e) {
    var target = $(e.target);
    if (target.is("button")) {
        var data = $(e.target).parent().text();
         } else{
          var data = $(e.target).parent().parent().text();
         }
        $.ajax({
            url: 'index.php?route=extension/module/strides_restoran_menu&action=edit&menu_name=' + data + '&user_token={{ token }}',
              type: 'GET',
              dataType: 'json',
            success: function(json) {
              $('#creat_menu #form-btns').nextAll('.form-group').remove();
              $.each(json, function(index, val) {
                $('#creat_menu #form-btns').after(
    ' <div class="form-group">' +
       '<label class="col-sm-2 control-label">{{ menu_price }}</label>'+
       '<div class="col-sm-2">'+
          '<input class="form-control" type="text" name="product_price[]" value="'+val.price+'">'+ 
       '</div>'+
       '<div class="col-sm-3">'+
          '<select name="product_id[]" class="form-control product_id">'+
            '{% for item in products_name %}'+
               '<option selected="false" value="{{ item.id }}" data-id="{{ item.id }}">{{ item.name }}</option>'+
               '{% endfor %}'+  
          '</select>'+ 
         '</div>'+
          '<button class="btn btn-danger product_delite" type="button"><i class="fa fa-trash"></i></button>'+
        '</div>'
        );

              $('#date option').each(function( key, vas ){
                    $(vas).attr('selected', function () {
                        if ( $(vas).val() === val.date ) {
                            $(this).attr( 'selected', true );
                        }else{
                            $(this).attr( 'selected', false );
                        }
                    });
               });             
           });
          }
      });
});

это результат первого выбора

Зачем строки кода 32-40, список со множественным выбором?
selected - это свойство и не смотря на то, что в html можно определить выбранную опцию посредством атрибута selected, в JQ со свойствами работают функцией .prop().
var target = $(e.target); - это тоже самое что и var target = $(this);

Спасибо вам заработало