html - how to append Options in Select Box Dynamically -

i want add 2 options in dropbox

$("#payment_method_1").append(new option("credit", "7")); $("#payment_method_1").append(new option("debit", "6")); 

when implement codes it's append problem it's appending many times instead of 1 time

    <select name="payment_method_1" id="payment_method_1" class="paysome" style="opacity: 0;">     <option value="1" selected="selected">cash</option>     <option value="2">credit card</option>     <option value="3">western union</option>     <option value="4">cheque</option>     <option value="8">bank</option>     <option value="7">credit</option>     <option value="6">debit</option>     <option value="7">credit</option>     <option value="6">debit</option>     <option value="7">credit</option>     <option value="6">debit</option>     <option value="7">credit</option>     <option value="6">debit</option>     </select> 

here loop

    $('.paysome').each(function(index, element) {        $("#payment_method_"+index).append(new option("credit", "7"));     $("#payment_method_"+index).append(new option("debit", "6"));     }); 

thanks in advance

you can create option , append select

$('.paysome').each(function(index, element) {             var index = index + 1;     var select = document.getelementbyid("payment_method_"+index);     select.appendchild(new option("credit", "7"));     select.appendchild(new option("debit", "6"));       } 

or,

$('.paysome').each(function(index, element) {             var index = index + 1;     $("#payment_method_"+index).append(new option("credit", "7"));     $("#payment_method_"+index).append(new option("debit", "6"));               } 

i see issue index.$.each index starts 0 , id index starts 1 may need update id or update code .

here fiddle