Hiding tr tags within div tags using jQuery
<h2><strong>EDIT</strong></h2>

<p><strong>I am editing this as it appears the many are focosing on the html formatting instead of the question. My apologies</strong></p>

<p><strong>Yes of course the div tag is sitting inside a table and yes of course the hiding of the tag in jquery is called once the DOM has been loaded</strong></p>

<p><hr></p>

<p>The Jquery is as follows;</p>

<pre><code>$(document).ready(function() {

    //naturally there is more in this file but this is all that happens to this tag
   $("#assessmentStatusReason").children().hide();
}
</code></pre>

<p>The HTML is as follows;</p>

<pre><code>&lt;table&gt;

        &lt;tr&gt;&lt;td class="fieldLabelBold"&gt;&lt;label&gt;CRN:&lt;/label&gt;&lt;/td&gt;
        &lt;td class="fieldText" id="uxCRN"&gt;&lt;/td&gt;&lt;/tr&gt;

        &lt;tr&gt;&lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Jobseeker Id:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxJobseekerId"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Name:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxName"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Date Of Birth:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxDateOfBirth"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Gender:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxGender"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Phone:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxPhone"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Mobile:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxMobile"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;

        &lt;div&gt;
        &lt;h3&gt;Addresses&lt;/h3&gt;
        &lt;/div&gt;

        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Residential Address:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxResidentialAddress"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Postal Address:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxPostalAddress"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Interpreter Required:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxInterpreterRequired"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;
                &lt;label&gt;
                    Language:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td class="fieldText" id="uxLanguage"&gt;
            &lt;/td&gt;
        &lt;/tr&gt;

        &lt;tr&gt;
            &lt;td class="fieldLabelBold "&gt;
                &lt;label&gt;
                    Assessment Status:&lt;/label&gt;
            &lt;/td&gt;
            &lt;td width="300px"&gt;                
                !{Html.DropDownList("assessmentDecision", Model.ReferralStatus, new { id = "uxassessmentDecision" })}
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;div id="assessmentStatusReason"&gt;
        &lt;tr id="uxNoShowDate"&gt;
      &lt;td class="fieldLabelBold"&gt;&lt;label&gt;No Show Date:&lt;/label&gt;&lt;/td&gt;
      &lt;td&gt;!{Html.DatePicker("uxNoShowDate", null, true, "100px")}&lt;/td&gt;
     &lt;/tr&gt;        

        &lt;tr id="uxReferralDeclinedReasonCode" &gt;
      &lt;td class="fieldLabelBold"&gt;&lt;label&gt;Declined Reason:&lt;/label&gt;&lt;/td&gt;
      &lt;td&gt;!{Html.DropDownList("DeclinedReason", Model.ReferralDeclinedReasonCode, new { id = "uxDeclineReasonCode" })}&lt;/td&gt;
     &lt;/tr&gt;       
        &lt;/div&gt;
        &lt;/table&gt;
</code></pre>

<p>Hi,</p>

<p>This is such as basic and I've seen the other posts on this kind of question but the answer strangely enough does not seem to work.</p>

<p>I have a div tag </p>

<pre><code>&lt;div id="assessmentStatusReason"&gt;
        &lt;tr&gt;
            &lt;td class="fieldLabelBold"&gt;&lt;label&gt;Reason:&lt;/label&gt;&lt;/td&gt;
            &lt;td class="fieldText" id="uxLanguage"&gt;&lt;input id="reasonInput2" /&gt;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;/div&gt;
</code></pre>

<p>and on the loading of the jquery I run </p>

<pre><code>$("#assessmentStatusReason").children().hide();
</code></pre>

<p>but the tr td and input are still visible on loading</p>

<p>any ideas?</p>
