Question

I have a map (intanceOf Google Maps) and dinamically i’m appending html to it. It’s a pim more specifically a richMarker. Everything goes right, the mark is there.

The problem is, i’m trying to set a class to a tag of this html rendered by richMarker and in the page i’m trying to catch this tag with JQuery selector, and of course do stuff with it.

some code:

the main page have this.

$.cometd.subscribe(channelCerca, function (comet) {

        if (comet.data.type== 0) //Enum ETipoCerca
            sigo.notifyError("viature: " + comet.data.viatura + " out");
        else if (comet.data.type== 1)
            sigo.notifyError("viature: " + comet.data.viatura + " out");

        color = comet.data.cercaColor;
        cerca = doDraw(comet.data, color);

        cadg.rastreador.cerca = true;
        cadg.rastreador.LoadRastreator(force, color );

        $('.blink').each(function () {
            var elem = $(this);
            setInterval(function () {
                if (elem.css('visibility') == 'hidden') {
                    elem.css('visibility', 'visible');
                } else {
                    elem.css('visibility', 'hidden');
                }
            }, 500);
        });

        //$(window).load(doBlink());
        //doBlink();
    });

loadRastreador do a lot of stuffs. In general:
1 – An ajax post
2 – Preparing the marker
3 – Append the marker to the map

on preparing the new marker i do:

//CERCA
    if (cerca) {
        desc = "<span class='blink' color: " + cor + "' >&nbsp;" + this.des + "</span>";
    }

i want to catch this span with blink class and make it blink with jquery.

$('.blink').each(function () {
            var elem = $(this);
            setInterval(function () {
                if (elem.css('visibility') == 'hidden') {
                    elem.css('visibility', 'visible');
                } else {
                    elem.css('visibility', 'hidden');
                }
            }, 500);
        });

the application is a little complex.. but my problem is simple.
by some reason jquery can’t see this new element.

I already have tried:
1 – put this jquery instruction inside done method method of ajax.
2 – using $(window).load()
3 – using text-decorarion: blink <- it work on firefox but you know.. it’s not recomended and chrome ignore it at all.

NOTE: if I catch this jquery instruction and execute it with chrome console or firefug the element start to blink as i want it to do.

Answer 1

Use CSS:

.hidden {
    visibility:hidden;
}

jQuery class selectors ALREADY select all of the elements as a group. No need to loop.

JS:

setInterval(function () {  
    $('.blink').toggleClass('hidden');
}, 500);