The following function was intended to apply a re-size process to various ULs found within DIVs that have the class name of “block”. The problem is that it only applies the functionality to only 1 UL and I think it’s because I haven’t used an array in all this… Anyway, the function is below and I would really appreciate any input on this because I think it’s almost there, but you’ll be the better judge:
function list_resize(z){
var w = document.getElementById(z).childNodes;
var div_height = 0;
var item_height = 0;
for(var a in w){//for each element in 'w'...
if(w[a].tagName == 'DIV' && w[a].className.match(/block/i)){
div_height = w[a].offsetHeight;
var ul = w[a].childNodes;
for(var b in ul){//for everything inside the DIVs...
if(ul[b].tagName == 'UL'){
var list_items = ul[b].getElementsByTagName('li');
for(var c=0;c<list_items.length;c++){//for every LI...
item_height += list_items[c].offsetHeight;
if(item_height > div_height){
list_items[c].style.visibility = "hidden";
}else{
list_items[c].style.visibility = "inherit";
}
}
}
}
}
}
}
If you need to test it out, just create 1 DIV and pass the ID of it to this function. Make sure this primary DIV contains at least 1 DIV with the class name of “BLOCK” and ensure that this child DIV has a couple ULs that go beyond the height confines of their containing DIV parent’s height, i.e. - “try to make the UL bust out of the DIV” (or just copy and paste the following markup and throw the function into an window.onload):
<div id="w"><div id="block" class="inline block">
<ul id="test">
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
<li>Nullam accumsan lectus id sapien tincidunt eleifend</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
</ul>
<ul id="test">
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
<li>Nullam accumsan lectus id sapien tincidunt eleifend</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
</ul>
</div>
<div id="block2" class="inline block">
<ul id="test2">
<li>Lorem ipsum dolor sit amet, consectetur adipiscing elit</li>
<li>Nullam accumsan lectus id sapien tincidunt eleifend</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
<li>Nunc eu tortor velit, vel aliquet turpis</li>
</ul>
</div></div>
Again, any input on why the function isn’t working would help this Javascript dummy out a lot. 
I was just hoping that I might have overlooked something obvious.