jquery - Distinct Append in Select -

how distinct value of select when append. see sample output below

 $(document).ready(function(){     $("#example2").on('click',"tr#paymentedit", "click", function(data){           var valuetoedit = new option(($(this).find('td:eq(2)').html()), "value");     valuetoedit.selected=true;     $("#paymenttypeedit").append(valuetoedit);               });     }); 

test each option see if 1 exists has value compares , perhaps replace value entered existing 1 (or visa versa)

you want avoid using text/label of option value. if don't decide there's no point setting values "value" (use valuetoedit = new option(($(this).find('td:eq(2)').html())); instead)

function foo() {  	var valuetoedit = $('#foo').val();  	var uniq = true;  	var options = $("#paymenttypeedit option");  	for(var i=0; uniq && < options.length; i++) {  	    if (valuetoedit.touppercase() === options[i].text.touppercase()) {  	        uniq = false;  	        valuetoedit = this.text; // use existing value  	    }  	}  	if (uniq) {  	    $("#paymenttypeedit").append(new option(valuetoedit, null, false, true));  	}  }    function init() {  	$('#but').on('click', foo);  }    $(document).ready(init);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>  <select id="paymenttypeedit"></select>  <input id="foo" type="text">  <button id="but">&nbsp;</button>