JS内のラジオボタンを放つとテキストボックスが表示される

Question

非常に単純ですが、なぜ発火しないのかわかりません。 ユーザーが「はい」をクリックするとテキストボックスが開き、ユーザーが「いいえ」をクリックしたときと何も選択されていないときに非表示になります。 私はそれを見て、動作するはずのコードをいくつか見つけましたが、そうではありません。

これは私のHTMLです：

 <form name="form2" onsubmit="return validateForm()" method="post"> 
     <fieldset id= "fieldset2"> 
     <legend>Step 2</legend> 
      Would you like your company name on your badges?<br> 
      <input type="radio" id="companyYes" name="company">Yes<input type="radio" id="companyNo" name="company">No<br> 
      <input type="text" id="companyText"> 
     <br> 
     <div id="company"></div> 
     Will anyone in your group require special accommodations?<br> 
     (if yes) Please explain below:<br> 
     <input type="radio" name="special" id="specialYes" value="Yes">Yes<input type="radio" id="specialNo" name="special" value="No">No<br> 
     <input type="text" id="specialText"> 
      <img id="check" src="check.png"> 
     </fieldset> 
    </form> 

これは私のJSです：

$("#companyYes").on("click", function() { 
    $("#companyText").show(); 
}); 
$("#companyNo").on("click", function() { 
    $("#companyText").hide();  
}); 
$("#specialYes").on("click", function() { 
    $("#specialText").show(); 
}); 
$("#specialNo").on("click", function() { 
    $("#specialText").hide(); 
}); 
$(Document).on("click",function(){ 

} 
$(document).ready(function() { 
    $("#check").hide(); 
    $("#specialText").hide(); 
    $("#companyText").hide(); 
}); 

Answer 1

あなたは、コンソールにエラーがあります。

Uncaught SyntaxError: missing) after argument list

あなたは

で );が欠落しています

$(Document).on("click",function(){ 

} 

JSFiddleの作業：

側注：

1. 活用document.ready()内のクリックイベントを入れすぎ

2. の代わりにjQueryを使って、ページの読み込み時にオブジェクトを非表示にするには、純粋なCSSを（display: none;）ページが最初に読み込まれたときにちらつくことはありません