javascript - How to get the first unique multivalue (array-notated) inputs in a form using jQuery? -

i have form this:

<form>     <select name="user_id[]"></select>     <select name="user_id[]"></select>     <select name="user_id[]"></select>     <select name="user_id[]"></select>     <select name="tag_id[]"></select>     <select name="tag_id[]"></select>     <select name="stack_id[]"></select>     <!-- ... etc. --> </form> 

i want jquery collection consisting of first multivalue elements name:

<form>     <select name="user_id[]"></select>   <!-- -->     <select name="user_id[]"></select>     <select name="user_id[]"></select>     <select name="user_id[]"></select>     <select name="tag_id[]"></select>    <!-- -->     <select name="tag_id[]"></select>         <select name="stack_id[]"></select>  <!-- -->     <!-- ... etc. --> </form> 

i've started $('[name$="[]"]') i'm stuck there. there simple selector method or have select them , filter ones want?

there's no magic method select elements in manner, manual work needed.

first of all, group elements name:

var buckets = {}; // keys: "name" attribute values, values: arrays of elements $('[name$="[]"]').each(function() {     var name = this.name,         bucket = buckets[name] || (buckets[name] = []);     bucket.push(this); }); 

then can select first element each bucket , put inside jquery object:

// start empty jquery object var $firstofeach = $([]);  // add above first element inside each bucket $.each(buckets, function() { $firstofeach = $firstofeach.add(this[0]); }); 

see in action.