jQuery, MVC, jSon - constructing table of divs, filled by call-backs

Question

Hi all,

I'm trying to construct a table with dynamically build information.

My thought was to put DivA inside each of the cells, and then put DivB and DivC inside the DivA-tags (DivB showing a 'loading' img and DivC showing the contents). I would then like the cells to be updated using json calls to my ASP.Net MVC web application. Does it sound crazy so far?!

<div class="divA">
    <h2>
        Stuff</h2>
    <div class="divB">
        <img src="Images/ajax-loader.gif" />
        <span>Loading</span>
    </div>
    <div class="divC">
    </div>
</div>

Using this code, I thought I could get my method activated and handle the call-back?

$(document).ready( 
    function() 
    {
        $("div.divA").each(
            function(i)
            {
               updateCellDivs($(this));
            }
         );
    }
 )

However... I'm getting exception on the attempt to call show on 'loading' below - calling fadeIn same thing. The 'loading' object is of type disphtmldivelement - but so is DivA.

I'm at a loss - what am I doing wrong?!

Thanks for any comments,

Anders, Denmark.

updateCellDivs = function(DivA)
    { 
        jQuery.getJSON("/Home/GetSomething",
        function(json)
        {
            mainDiv  = DivA[0];

            divs = $("div", mainDiv);

            loading  = divs[0];
            contents = divs[1];

            // Abort if there is no data to update.
            if (contents.length==0)
            {
                return;
            }

            loading.show(1000);
            //contents.fadeOut(1000);

            // If no response was given, the data was not yet available.
            // Ask again in two seconds!
            if (json == "")
            {
                setTimeout(updateCellDivs, 2*1000);
                return;
            }                

            DivA.fadeOut(1000);
            //loading.fadeOut(1000);


            DivA.fadeIn(1000);

        });         
    }