title: onchange not working when content changed by JS
body: <p>I made a script that selects an option from a dropdown menu. 
  The scrips is working but the dropdown menu also have an <code>onchange</code> listener, and this listener doesn't fire when the dropdown option is selected with JS?</p>
  
  <p>Example:</p>
  
  <p>If I choose T405 from the dropdown manually the <code>onchange</code> script fires.
  If I make the my script select T405 from the dropdown the dropdown shows the selected option, but the <code>onchange</code> script doesn't fire?</p>
  
  <p>My simple html code (it's gonna be an <code>img</code> later):</p>
  
  <pre><code>&lt;ul&gt;
    &lt;li onclick="selectItemByValue('bundle-option-132', 700)"&gt;Test&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>My JS (which is working and selecting an option from the dropdown):</p>
  
  <pre><code>&lt;script&gt;
     function selectItemByValue(dropValg, value) {
        var denne = document.getElementById(dropValg);
        denne.value = value;
     }
  &lt;/script&gt; 
  </code></pre>
  
  <p>Is there any way to "update/refresh" the dropdown so that the <code>onchange</code> script will fire when an option is chosen by my script?</p>
  
  <p>I've even tried firing the <code>onchange</code> script from within my own script?</p>
  
  <pre><code>&lt;script&gt;
     function selectItemByValue(dropValg, value) {
        var denne = document.getElementById(dropValg);
        denne.value = value;
  
        bundle.changeSelection(denne);
     }
  &lt;/script&gt; 
  </code></pre>
  
  <p>----------------- EDIT ----------------</p>
  
  <p>It now works when adding <code>denne.onchange()</code> to my script and running this as a "snippet", but it doesn't work on my "Live site"?</p>
  
  <p>It seems that there's an event listener that's overriding the inline <code>onchange</code> call? A script called prototype.js? If I delete the <code>onchange</code> part of the <code>&lt;select&gt;</code> element this script just runs it/adds it anyway.</p>
  
  <p>I'm using a script in my Magento Shop that's called OptionBundle and it's this script that isn't triggered when a change the dropdown option with JS?
  If I delete prototype.js my script works perfectly, but it of coarse breaks the functionality of the OptionBundle script.</p>
  
  <p>I'm gonna try writing the author of the script.</p>
  
  <p>Working example (with added  <code>denne.onchange()</code>):
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function selectItemByValue(dropValg, value) {
    var denne = document.getElementById(dropValg);
    denne.value = value;
    denne.onchange();
    console.log(denne.value);
    console.log(denne);
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;ul&gt;
    &lt;li onclick="selectItemByValue('bundle-option-132', 700)"&gt; Click to change&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;select onchange="alert('Content changed')" id="bundle-option-132" name="bundle_option[132]" class="bundle-option-132 bundle-option-select change-container-classname" wtx-context="276DE744-A364-4DD3-AEFC-0D9F9A9AAE19"&gt;
    &lt;option value=""&gt;Udvælg...&lt;/option&gt;
       &lt;option value="875"&gt;Bianco&lt;/option&gt;
       &lt;option value="695"&gt;T400&lt;/option&gt;
       &lt;option value="697"&gt;T402&lt;/option&gt;
       &lt;option value="698"&gt;T403&lt;/option&gt;
       &lt;option value="699"&gt;T404&lt;/option&gt;
       &lt;option value="700"&gt;T405&lt;/option&gt;
       &lt;option value="702"&gt;T407&lt;/option&gt;
       &lt;option value="703"&gt;T408&lt;/option&gt;
       &lt;option value="704"&gt;T409&lt;/option&gt;
       &lt;option value="705"&gt;T410&lt;/option&gt;
  &lt;/select&gt;</code></pre>
  </div>
  </div>
  </p>