html select не отображает правильное значение

Question

В firefox 46.0.1 есть только один выбор element с некоторыми элементами option. Атрибут select значения изменяются с помощью яваскрипта кода и как подтверждение того, для этого, в окне браузера инспектор

<select value="G" data-id="someid"> и один из вариантов
<option value="G">G please</option>

Но в консоли:
$('select').first().val() дает пустым строка, как в "", и, таким образом, на дисплее не отображается выбранная опция, как я ожидаю.

И если я выдаю $('select')[0].value = "R", на дисплее отобразится правильное значение параметра.

Почему и как исправить это, чтобы он отображал правильную опцию, когда код javascript chnages атрибут value элемента select? Благодаря

<template name="select"> 
    <select data-id={{_id}} value={{value}}> 
    {{#each values}} 
     <option value={{value}}>{{caption}}</option> 
    {{/each}} 
    </select> 
</template> 

Значение заполняется помощник Метеор шаблона.

редактировать
здесь является нижележащие данные помощника: "образец"

{ 
    "_id" : "SqNF9wTsbaxEhj5b4", 
    "element" : "select", 
    "action" : "action12", 
    "values" : [ 
     { 
      "group" : "bCode", 
      "value" : "G", 
      "caption" : "Select food type..." 
     }, 
     { 
      "group" : "bCode", 
      "value" : "O", 
      "caption" : "water" 
     }, 
    ], 
    "userId" : "uhx7rt", 
    "createdAt" : 1464135235771, 
    "value" : "G" 
} 

Answer 1

, как charlietfl предложил в комментариях. Мне пришлось отказаться от использования атрибута value в элементе select, и вместо этого я использовал атрибут selected на элементе option.

И как было предложено в другом сообщении, Meteor не разрешает пустое значение атрибутов html. Мне пришлось удалить атрибут для параметров, в которых он не выбран.