根据“是/否”单选按钮有条件地显示/隐藏表行

我有一个简单的html表单，表中有一系列问题。如果用户对"是/否"单选按钮问题回答"是"，那么我想显示一个隐藏行，允许他们在文本区域字段中输入详细信息。如果单击"否"，则文本区域输入应被清除并再次隐藏。

这是我的html表单，有一个是/否问题和一个隐藏行，如果他们点击是，可以获得更多详细信息：

<form class="form-horizontal" action="#" method="post" id="questionForm">
      <input type="hidden" name="recid" value="1">
      <table class="table table-condensed table-hover table-bordered">
          <tr>
          <td><strong>Question 1</strong></td>
          <td>please answer yes or no to this question</td>
          <td>
              <div class="controls">
                  <label class="radio inline">
          <input type="radio" name="question1" id="question1" value="Yes" required>Yes        </label>
                  <label class="radio inline">
          <input type="radio" name="question1" id="question1" value="No" required>No          </label>
                  <label for="question1" class="error"></label>
        </div>
          </td>
          </tr>

          <tr class="question1yes">
          <td></td>
          <td>Please describe this and when it started</td>
          <td>
              <div class="controls">
          <textarea name="question1Details" rows="3"></textarea>
          <label for="question1Details" class="error"></label>
        </div>
          </td>
          </tr>
          </table>
</div>              
                    <div class="control-group">
            <div class="controls">
              <button type="submit" class="btn btn-primary">Continue</button>
              <button type="reset" class="btn">Reset</button>
            </div>
        </div>
      </form>

这是我目前不起作用的脚本：

$().ready(function() {
        // validate the form when it is submitted
        $("#questionForm").validate();
        if($("#question1:checked").length != 0){
                    // yes is checked... show the dependent fields  
                        $(".question1yes").show(); 
                    }else{
                        // hide it and blank the fields, just in case they have something in them
                        $(".question1yes").hide(); 
                        $("#question1Details").val("");
                    }

        $("#question1").click(function(){ 
                    // show the dependent fields
                    if(this.value == "Yes"){
                        $("#question1yes").show();
                    }else{
                        // hide the dependent fields and blank them
                        $(".question1yes").hide();
                        $("#question1Details").val("");
                    }
                    });
        });

我在这里设置了一个jsFiddle，它展示了我目前的状态。我的可选行从隐藏开始，但单击"是"单选按钮时不可见。