Question

I have a $.getJSON call that’s too long to post here. It all works fine except when I try to hide a div. My data is coming back from the database in the callback as “data” and is processed in a “for” loop (with “i” as the increment) in the callback. All of my data displays elsewhere fine. But when I try to do this:

var div = '#row' + data[i].id;
$(div).hide();

it fails.

I can replace “data[i].id” with the row number from the database and the div is hidden. If I alert div, I get “#row664” or whatever. Something about the combination of “#row” and the dynamically generated ID is causing the hide to fail.

The HTML in the same callback is:

   html = '<div id="row' + data[i].id + '">';

The HTML is appended to a div at the end of the callback. Everything else works, like I said. So it seems like this should work. What am I doing wrong?

Answer 1

make sure you append the div before you hide it.

var div = '#row' + data[i].id;
var html = '<div id="' +div+ '">';
$('body').append(html);
$(div).hide();