Why is getting the next 'div' in my jQuery not working?
<p>I have the following jQuery that <em>does</em> find the ASP.NET server control (tested by placing an alert() inside block), but it does not set the height on the next DIV in the DOM using .next(). However if I use straight JS to do the same thing, calling the DIV by ID directly it works fine.</p>

<p>What I am trying to do is not use the hardcoded ID of the DIV in case it changes, and rather walk the DOM to dynamically get to the element and set the height.</p>

<p>So 1st: the HTML source of what I am trying to manipulate:</p>

<pre><code>&lt;div id="WebViewer" style="height:100%;width:100%;margin-right: 0px"&gt;
   &lt;input name="WebViewerReportReceipt" type="hidden"/&gt;
   &lt;input name="WebViewerViewerType" type="hidden"/&gt;
   &lt;DIV id="WebViewer_controlDiv"&gt;
    &lt;iframe src="295769102_1619997395_16141400_2120403583/CacheItem" style="width:100%;height:100%;"&gt;&lt;/iframe&gt;
   &lt;/DIV&gt;
&lt;/div&gt;
</code></pre>

<p>Next the non-working jQuery that I think <em>should</em> work:</p>

<pre><code>//Using the 'DIV' that is created by the viewer (at runtime), resize it dynamically to fit the window
    var myHeight = $(window).height();
    if ($('#&lt;%=WebViewer.ClientID %&gt;') != null) {                
          $('#&lt;%=WebViewer.ClientID %&gt;').next('div').height(myHeight - 10);
    }
</code></pre>

<p>And lastly the JS that <em>does</em> work, but I would prefer not to access that DIV by a hardcoded ID and use jQuery instead:</p>

<pre><code>var myHeight = $(window).height();
//Using the 'DIV' that is created by the viewer (at runtime), resize it dynamically to fit the window
if (document.getElementById('WebViewer_controlDiv') != null) {
    document.getElementById('WebViewer_controlDiv').style.height = myHeight - 10;
}
</code></pre>

<p>Any ideas on why walking the DOM in jQuery to get the 'next' div and set its height is not working?</p>

<p>Thanks!</p>
