Skip to content
Advertisement

How to delete HTML Elements in an iFrame using JavaScript

I have an iFrame and a div with content in it. I want to delete the div via JavaScript, is that possible and how could I do that?

I don’t want to just not display it (eg. display: none via CSS) but remove it from the HTML of the site. I have basic knowledge of JavaScript but don’t have any experience working with an iFrame.

Answer

You can use

$("#iFrameId").contents().find("#yourDiv").empty();

It is better to use remove()

example: $("#iFrameId").contents().find("#yourDiv").remove();

Explanation

empty() will remove all the contents of the selection.

remove() will remove the selection and its contents and all the event handlers associated with it.

For reference:

  1. http://api.jquery.com/remove/
  2. http://api.jquery.com/empty/
Advertisement