javascript - javascript で div を非表示/表示する

Question

特定のチェックボックスがチェックされている場合にのみフォームフィールドのテキストボックスを表示し、チェックされていない場合は非表示にしたいと思います。ボックスをチェックすると非表示にするコードを取得しましたが、ボックスをチェックするまでページが読み込まれるとテキストボックスが表示されます。これは、私が達成したいこととは反対です。私はjavascriptの初心者なので、これはかなり初歩的なことだと確信しています。助けてくれてありがとう。

HTML:

<input type="checkbox" onclick="ShowCCFields(this.value);" name="CAT_Custom_510969" id="CAT_Custom_510969_7" value="Other..." />
Other...

<div class="item" id="other">
    <label for="CAT_Custom_510972">Other:</label><br />
    <textarea onkeydown="if(this.value.length&gt;=4000)this.value=this.value.substring(0,3999);" class="cat_listbox" rows="4" cols="10" id="CAT_Custom_510972" name="CAT_Custom_510972"></textarea>
</div>  

JavaScript:

// Hide or show textarea if the other checkbox field is checked
        var voucher = document.getElementById("CAT_Custom_510969_7");
        function ShowCCFields(val) {                            
            if (!document.getElementById('other'))
                return;         
            if (val == voucher.checked)
                document.getElementById('other').style.display = 'inline';              
            else
                document.getElementById('other').style.display = 'none';
        }