Using jQuery with auto-generated JSF identifiers (problem with ":")

Question

I read this post Colon Processing in the identifier of an element in the CSS selector , which describes how to select a known identifier containing a colon.

I would like to create a JSF list containing images. Then, using jQuery, I would like to select each image and read in id. Is this possible if you do not write code to replace the colons?

Answer 1

Use jQuery to iterate over each individual img element . Assuming your item ulhas an id wx:yz:

// Use jQuery to select all images within
var imgs = $('#wx\\:yz img');

// Iterate over each one and give the image ID to the library
// only if the image actually has an ID.
imgs.each(function() {
    if(this.id && this.id.length) {
        nameOfYourLibraryFunction(this.id);
    }
});

Answer 2

JSF.