How to use .setValue() ?

[inspector71]

Want to programmatically change the selected option.

First I initialize many selectize instances on document.(ready) via a jQuery selection of many select fields at once:

      jQuery('.booleanWithDependancies select').selectize({

        plugins : ["clear_button"]

      });

Note: I'm not storing the result in a variable. Perhaps I need to?
Note: All instances work as expected, so I'm unsure if initializing multiple instances in one jQuery selection is a problem, but maybe it is?

Later, I try to grab one instance like this:

var $selectizeInstance = jQuery( '#' + variable ).selectize;

... where variable is a identifier string, because the above is used within a loop to iterate through setting the value of more than one selectize instance, and this is the result:

function selectize(settings_user)

I found documentation for getting an instance of a selectized element and tried to follow it but not convinced I am following it properly because I'm not storing the many selectize_ instances created with the first code example above. Also unsure what $selectize[0] refers to. First of many possible instances?

Having seemingly got a selectize instance, this:

$selectizeInstance.setValue([ 43 ]);

results in:

Uncaught TypeError: jQuery(...).selectize.setValue is not a function

Tried to finding clues via the only .setValue() documentation I found but that only demonstrates calling .setValue() in an event handler assignment scenario:

<select id="select-tools" multiple placeholder="Pick a tool..."></select>

var $select = $('#select-tools').selectize({
  maxItems: null,
  valueField: 'id',
  labelField: 'title',
  searchField: 'title',
  options: [
    {id: 1, title: 'Spectrometer', url: 'http://en.wikipedia.org/wiki/Spectrometers'},
    {id: 2, title: 'Star Chart', url: 'http://en.wikipedia.org/wiki/Star_chart'},
    {id: 3, title: 'Electrical Tape', url: 'http://en.wikipedia.org/wiki/Electrical_tape'}
  ],
  create: false
});

var control = $select[0].selectize;

$('#button-setvalue').on('click', function() {
  control.setValue([2, 3]);
});

However the 'event' I am using is the response from an XHR request. So all I really need to do, or so I think/thought, is to get a selectize instance and set it's value.

Does anyone have some insight on how to do this, perhaps where I am going wrong?

[inspector71]

UPDATE: I figured this one out.

It does seem that, as suspected, I needed to 'trap' (AKA assign) each instance I was creating with the jQuery selection returning many select elements as selectize instances. This involved the following:

      jQuery('.booleanWithDependancies select').each( function ( idx , el ) {

        window[ '$selectize' + el.name ] = jQuery( el ).selectize({

          plugins : ["clear_button"]

         });

      })

Apparently window['$selectize' + el.name ] is the same as creating a dynamic, unique variable on the fly using eval(). Having memory burn of whispers that eval() is a performance hit, I went with window[] instead.

Later ...

       jQuery.ajax({

          url   : 'scriptReturningJSON',
          data  : {

            item : ev.currentTarget.value

          }

        }).done( function ( rspnse ) {

          if ( typeof rspnse[0] !== 'undefined' ) {

            jQuery.each( rspnse , function ( idx , el ) {

                const selectIdSuffixString  = rspnse[ idx ].variety;
                const optionValueInteger  = rspnse[ idx ].id;

                var control = window[ '$selectize' + selectIdSuffixString ][0].selectize;

                    control.setValue( optionValueInteger )

              }

            });

          } 

        });

I hope this helps someone in the future.