javascript - Set each option value dynamically -


i've got on page

<script id="score" type="text/template">     <select name="scoreselector">         <option value="" disabled selected>your score</option>         <option id="val1" value="0">quarter</option>         <option id="val2" value="0">half</option>         <option id="val3" value="0">three quarter</option>     </select> </script> 

how set each option value?

e.g.

<script>     $('select[name=scoreselector]').val('0.25'); </script> 

since above select inside <script id="score" type="text/template">, how set values dynamically using jquery?

demo of @rayondabre's solution:

var vals = [null, 1 / 4, 1 / 2, 3 / 4];  $('select[name="scoreselector"] option').each(function(i, o) {    $(o).val(vals[i]);  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <select name="scoreselector">    <option value="" disabled selected>your score</option>    <option id="val1" value="0">quarter</option>    <option id="val2" value="0">half</option>    <option id="val3" value="0">three quarter</option>  </select>


Comments