Допустим у вас есть несколько выпадающих списков (тег select), все они имеют одинаковый класс, например «.my-variation» и надо как то получить выбранные данные с первого списка.
Пример структуры
<select class="my-variation"> <option value='111'></option> <option value='222'></option> <option value='333'></option> </select> <select class="my-variation"> <option value='x-111'></option> <option value='x-222'></option> <option value='x-333'></option> </select> <select class="my-variation"> <option value='s-111'></option> <option value='s-222'></option> <option value='s-333'></option> </select>
Реализация скрипта onclick по первому элементу
А теперь сам код JavaScript по считыванию значения с первого селекта
<script>
( function( $ ) {
"use strict";
$('.my-variation:first').on('change', function(){
alert($(this).val());
})
}( jQuery ) );
</script>
Если вы заметили, к классу добавляется «:first«, который будет указывать что обрабатывать именно первый элемент. Таким образом можно обрабатывать и последний и четные или не четные элементы, или де указать номер нужного элемента.