Clever Geek Handbook

JQuery selector issue

I have two in a table with ids row_26 and notificationrow_26. notificationrow_26 is dynamically added to the DOM after the page has loaded.

I want to highlight notificationrow_26. So I am using

var deviceUID = 26;
$("#notificationrow_" + deviceUID).effect("highlight", {}, 3000);

but when i do it. It doesn't highlight this line. I also tried just accessing notificationrow_26 but it doesn't even have access to that.

It allocates row_26 when I ask it. I've heard something about jquery live, but how can I access it with jquery live? I think jquery live is just events and stuff. I just want to access this line that has been added to the DOM dynamically.

Did I miss something?

+2


source to share


2 answers


You will need to call the .effect statement after adding elements to the DOM. You can use .live if you are attaching elements to the DOM using 'click' or other common events (not "modify", although you need a livequery for this).



+4


source


I'm not familiar with .effect()

, is this a plugin or part of another JavaScript framework? The following code will highlight the line, provided there are no contraction conflicts $

on the page

var deviceUID = 26;
$("#notificationrow_" + deviceUID).css('background-color','highlight');


this can only be applied after the string has been inserted into the DOM (I mean, when the command is executed, it will only affect those elements that match the selector that exists in the DOM at the time).

So, depending on how the string is added, you can add highlighting to the callback function, if there is one, concatenate the highlight command into the string before / immediately after inserting it into the DOM. Here is a demo to show the above code.

+1


source






More articles:


All Articles