Clear dynamic content with jQuery

Question

After loading dynamic content to a DIV, I'd like to add a Close option, that would remove this content from the DOM.

I'm working with jQuery and WordPress.

Any ideas?

Answer 1

Sure! You can use hide or remove based on your requirements.

$("#close_link").click(function() {
  $("#your_div").hide(); 
});

or

$("#close_link").click(function() {
  $("#your_div").remove(); 
});

Answer 2

You can remove elements form a page. If say your element's ID was 'foo' then you could do it like this

$('#foo').remove();

Answer 3

The .remove() function will do the trick. The question is what to remove. If your dynamic content has some particular class, you could do something like this:

$(".stuff-to-remove").remove();

It sounds like you'll be generating the "Close" link dynamically too, so your code might look something like:

var div = $('<div></div>');
// ... put stuff in the div...

var close = $('<a href="#"></a>').click(function() {
    div.remove();
    return false;
});
div.append(close);

Here there's no need to find the dynamic content, since you already have ready access to it in a variable.