title: foreach get value from selected item
body: <p>How to fire foreach value from the option selected?</p>
  <p>I have tried below but it's fired the same value on each.</p>
  <p><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>$(".fida").on("change", function() {
    //Getting Value
    var value = $(this).val();
    $(".abi").val(value);
    alert(value);
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;select class="fida"&gt;
    &lt;option value="0"&gt;0&lt;/option&gt;
    &lt;option value="666"&gt;666&lt;/option&gt;
    &lt;option value="777"&gt;777&lt;/option&gt;
    &lt;option value="888"&gt;888&lt;/option&gt;
    &lt;option value="999"&gt;999&lt;/option&gt;
  &lt;/select&gt;
  &lt;input type="text" class="abi" placeholder="get value from selected" /&gt;
  
  &lt;select class="fida"&gt;
    &lt;option value="0"&gt;0&lt;/option&gt;
    &lt;option value="777"&gt;777&lt;/option&gt;
    &lt;option value="888"&gt;888&lt;/option&gt;
    &lt;option value="999"&gt;999&lt;/option&gt;
  &lt;/select&gt;
  &lt;input type="text" class="abi" placeholder="get value from selected" /&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>Jsfiddle: <a href="https://jsfiddle.net/abilashu/8mazw2cg/62/" rel="nofollow noreferrer">https://jsfiddle.net/abilashu/8mazw2cg/62/</a></p>