如何在许多相同的DOM元素上进行javascript函数控制？

Question

我有这个javascript函数来显示第二个“选择”取决于第一个“选择”，下面的参数是第一个“选择”的值，

function load_Second_menu(parameter) {
    $.ajax({
        type: 'post',
        url: 'generateSenondMenu.php',
        data: {
            get_option: parameter
        },
        success: function (response) {
            //this line of code works well on general HTML element 
    document.getElementById("category_new_select_ccv").innerHTML = response;
     //here i need to do the same thing for the DOM element             
        }
    });
}

在项目中，每次单击添加一个以上模块时，都会出现另一组两个“选择”输入。

DOM元素如下所示

$(document).ready(function (e) {
 var html =
        '<Label>Make first Select</label> ' +
        '<select name="Select_shop[]" id="child-shop" onchange="load_Second_menu(this.value)"> ' +
        '"<?php while ($some_statement) echo "<option value=\"$value\" > $row[shop_name]</option>" ?>" </select>' +
        '<select name="second_menu[]" id="second_menu_id" >' +
        '</select>';
}) 

所以，我该如何更改id =“ second_menu_id”的“选择”， ID的getelements显然不起作用，因为它是唯一的。 如果我在页面上添加五次“ html”变量，那么如何使load_Second_menu（）函数适用于五个“ select”，简而言之，我如何才能在许多元素上做出努力？

在“ generateSenondMenu.php”中，只需一些PHP代码即可生成第二个菜单的内容，并使用“ option”标记将它们与“ select”相呼应。

谢谢！