Remove image dynamically using jquery by clearing the src attribute

Question

I know one can load image dynamically using

$("#id").attr("src","path of the image"),

but to onload the certain image on certain event,

$("id").attr("src","")

doesn't work.

What's the correct way to unload the image runtime using jquery??

I cannot change the display or the visibility property of the image, I need to load an unload it.

Answer 1

There are number of ways to do this. You can use the one suits you

1. $('#id').removeAttr('src');​ // Remove the src
2. $('#id').remove(); //This will remove the element from DOM so be careful

3. $('#id').attr('src', 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=='); // This will change the src to a 1x1 pixel

4. $('#id').removeAttr('src').replaceWith($image.clone()); //That worked for few people