选中复选框后，选中复选框

I've got these set of checkboxes. They correspond to the days on which people are available for work. This system will be used to create a 'work schedule'. However, when the boss checks a checkbox (to have people work on that certain day), it should change to a select box so that the boss can tell where people will be working.

The checkboxes get their name in this way: {UserID}_[]. The value of the checkbox corresponds to the day in the week (Monday -> 0, Tuesday -> 1, Wednesday -> 2 etc.). The select box is made in this way: {UserID}_select_[].

I tried to use the following type of jquery script to get this working:

<script>
    var userList = <?php echo json_encode($userIdList); ?>;

    function swapInput(obj) {
        for (var i in obj) {
            $(document).ready(function() {
                $("input[name='" + obj[i] + "_[]']").change(function() {
                    if ($(this).prop('checked')) {
                        $(this).hide();
                        $('input[name="' + obj[i] + '_select_['$(this).val()']"]').show();
                    }
                }
            }
        }
    }

    swapInput(userList);

</script>

However, I'm quite new to jquery, so I might need some help there. I retrieve a php array from a database to get all the user ID's of which we have an availability. This one is converted to a jquery variable. I try to loop through that to get every single ID and make a line of code to hide the checkbox. Though.. it does not work.. as always...

When I var_dump the userIdList php variable, this is my result:

array(3) { [0]=> int(1) [1]=> int(2) [2]=> int(4) }

This means the user ID's are 1, 2 and 4. But who can help me with the jquery part?

attached a super simple jquery code to demo show/hide select when toggling checkbox. Notice I use id instead of name. Few other things to consider:

Change .change to .click.
Move $(document).ready(function() outside of for loop, it should run once only.

$("#check").click(function(e) {
  if ($(this).prop("checked")) {
    $(this).hide();
    $("#select").show();
  }
})

#select {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<input type="checkbox" id="check">
<select id="select">
  <option>Testing</option>
</select>
</body>
</html>

</div>