JQuery实现单选按钮控制文本字段显示/隐藏失效问题求助

我写了一段代码，想通过单选按钮的选择来控制文本框行的显示与隐藏，但目前这段代码无法正常工作。想请教下各位，该怎么调整才能实现需求？

具体需求是：当选中useDockerCompose的Yes选项时，显示"Docker Compose Command"对应的文本输入行；选中No时则隐藏这一行。

以下是我的代码：

<tr><td>
    <b>Docker Compose</b>
    <a href="#" id="dcPop" rel="popover" data-content="Application deploys set to use docker compose to spin up the container" data-original-title="Use Docker Compose"><i class="icon-question-sign"></i></a>
</td><td>               
    <input type="radio" value="false" name="useDockerCompose" CHECKED> No &nbsp;
    <input type="radio" value="true" name="useDockerCompose"> Yes
</td></tr>          
<tr class="dccommandtext" style="display:none;">
    <td nowrap><b>Docker Compose Command</b></td>
    <td><input type="text" class="input-xxlarge" name="dccommand"></td>
</tr>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
            // Function to show/hide the Docker Compose Command input based on the selected radio button
            function showdccommand() {
                var selectedValue = $('input[name="useDockerCompose"]:checked').val();
                console.log("Selected value: " + selectedValue);  // For debugging

                if (selectedValue === "false") {
                    $('.dccommandtext').hide();
                } else {
                    $('.dccommandtext').show();
                }
            }

            // Attach the 'change' event listener to the radio buttons
            $('input[name="useDockerCompose"]').on('change', showdccommand);

            // Trigger show/hide on page load to set the initial state based on the default selected value
            showdccommand();
        });
</script>

备注：内容来源于stack exchange，提问作者code-geek