How do you make an element "flash" in jQuery

You can use the jQuery Color plugin.

For example, to draw attention to all the divs on your page, you could use the following code:

$("div").stop().css("background-color", "#FFFF9C")
    .animate({ backgroundColor: "#FFFFFF"}, 1500);

Edit - New and improved

The following uses the same technique as above, but it has the added benefits of:

• parameterized highlight color and duration
• retaining original background color, instead of assuming that it is white
• being an extension of jQuery, so you can use it on any object

Extend the jQuery Object:

var notLocked = true;
$.fn.animateHighlight = function(highlightColor, duration) {
    var highlightBg = highlightColor || "#FFFF9C";
    var animateMs = duration || 1500;
    var originalBg = this.css("backgroundColor");
    if (notLocked) {
        notLocked = false;
        this.stop().css("background-color", highlightBg)
            .animate({backgroundColor: originalBg}, animateMs);
        setTimeout( function() { notLocked = true; }, animateMs);
    }
};

Usage example:

$("div").animateHighlight("#dd0000", 1000);

You could use the highlight effect in jQuery UI to achieve the same, I guess.

If you're using jQueryUI, there is pulsate function in UI/Effects

$("div").click(function () {
      $(this).effect("pulsate", { times:3 }, 2000);
});

http://docs.jquery.com/UI/Effects/Pulsate

You could use this plugin (put it in a js file and use it via script-tag)

http://plugins.jquery.com/project/color

And then use something like this:

jQuery.fn.flash = function( color, duration )
{

    var current = this.css( 'color' );

    this.animate( { color: 'rgb(' + color + ')' }, duration / 2 );
    this.animate( { color: current }, duration / 2 );

}

This adds a 'flash' method to all jQuery objects:

$( '#importantElement' ).flash( '255,0,0', 1000 );

Would a pulse effect(offline) JQuery plugin be appropriate for what you are looking for ?

You can add a duration for limiting the pulse effect in time.

As mentioned by J-P in the comments, there is now his updated pulse plugin.
See his GitHub repo. And here is a demo.

$("#someElement").fadeTo(3000, 0.3 ).fadeTo(3000, 1).fadeTo(3000, 0.3 ).fadeTo(3000, 1); 

3000 is 3 seconds

From opacity 1 it is faded to 0.3, then to 1 and so on.

You can stack more of these.

Only jQuery is needed. :)

Straight jquery, no plugins. It blinks the specified number of times, changes the background color while blinking and then changes it back.

function blink(target, count, blinkspeed, bc) {
    let promises=[];
    const b=target.css(`background-color`);
    target.css(`background-color`, bc||b);
    for (i=1; i<count; i++) {
            const blink = target.fadeTo(blinkspeed||100, .3).fadeTo(blinkspeed||100, 1.0);
            promises.push(blink);
    }
    // wait for all the blinking to finish before changing the background color back
    $.when.apply(null, promises).done(function() {
            target.css(`background-color`, b);
    });
    promises=undefined;
}

Example:

blink($(`.alert-danger`), 5, 200, `yellow`);

you can use this code :) change mili value for change animation speed

var mili = 300
for (var i = 2; i < 8; i++) {
   if (i % 2 == 0) {
      $("#lblTransferCount").fadeOut(mili)
   } else {
      $("#lblTransferCount").fadeIn(mili)
   }
}

CSS supports flashing in all major browsers

.flash {
    animation: flash 0.5s ease-out;
    animation-iteration-count: 10;
}
@keyframes flash {
    0% { opacity: 0.5; }
    50% { opacity: 1.0; }
    100% { opacity: 0.5; }
}

add this class to the element you want to flash

$(elem).addClass("flash");

iteration-count: 10 is how many times you want it to flash, no need to remove the class, it will stop flashing on its own.

by using opacity: this works for elements of any colour as long as its not already transparent.