Umair Ayub
Umair Ayub

Reputation: 21241

Remove DIv with Specific ID from a DIV stored in a variable

When admin changes the status of an order, markup of #shipping_addr_detail_div is sent to server to be sent via Email to customer.

There is a DIV #dont_show_in_email inside #shipping_addr_detail_div.

I am sending markup of #shipping_addr_detail_div at server side but I do not want #dont_show_in_email inside this.

Here is one of my attempt to do so

    var shipping_addr_detail_div = $("#shipping_addr_detail_div").html();

    shipping_addr_detail_div.find("#dont_show_in_email").remove();

this give me error TypeError: order_items_detail.find is not a function

I know I can remove it with $("#shipping_addr_detail_div #dont_show_in_email").remove() but it is also removed from my HTML page in browser.

To be precise:

Remove #dont_show_in_email from the markup stored in shipping_addr_detail_div variable but do not remove #dont_show_in_email from the page being displayed in browser

Upvotes: 0

Views: 110

Answers (2)

Anatoli
Anatoli

Reputation: 690

There is one important thing that you need to change in this exmaple.

Your exmaple: $("#shipping_addr_detail_div").clone().find("#dont_show_in_email").remove();

Right example: var searchVar = $("#shipping_addr_detail_div").clone(); searchVar.find("#dont_show_in_email").remove();

In the first exmaple the problem is in remove. You'll see in your result "dont_show_in_email". In the second example the result is element with id shipping_addr_detail_div without element "dont_show_in_email".

Or you can use the code of " Satpal".

Upvotes: 0

Milind Anantwar
Milind Anantwar

Reputation: 82241

To get the html of element without its child element:

$("#shipping_addr_detail_div").clone()
        .find('#dont_show_in_email')
        .remove()
        .end().html()

Working Demo

Here is how it works:

-clone the element

-find and remove the element that is not required

-use .end() to end the most recent filtering operation in the current chain and return the set of matched elements to its previous state. i.e.#shipping_addr_detail_div in your case

-get the html of element

Upvotes: 1

Related Questions