tdoakiiii
tdoakiiii

Reputation: 372

Resetting a jquery object

I have hit a bit of a design flaw with a project. In this project I initialized some variables as jquery objects.

var $overlay = $('<div id = "overlay"/>');

The intention is that there is only one overlay so I thought it would be easier to keep it assigned to a variable. I have functions that add classes to it, html to it, etc. There is also the ability to remove it via jquery like

$overlay.remove();

What I never took in to account is that any class or html applied to this div is still going to be present if I ever want to show the overlay again with new information or attributes. How can I "reset" this variable?

I made this jsfiddle to demonstrate the two methods I could have used.

$box is akin to my $overlay issue where if you change its colour, destroy it, and then remake it, it will have this new colour still. I know this is mostly a design flaw but if there is no way around it I will re-design..

http://jsfiddle.net/mLnmbkhj/10/

Upvotes: 0

Views: 115

Answers (2)

Etwillms
Etwillms

Reputation: 43

If I'm understanding your problem, could you add an on click event for leaving the overlay? In the event, .detatch() the element you want off.

Upvotes: 0

Nirmal Patel
Nirmal Patel

Reputation: 5168

How about just re-initializing?

$('#destroyBox').on('click', function () {
    $box.remove();
    $box = $('<div id="box"/>');
    // Would like to somehow reset the box object
});

Upvotes: 2

Related Questions