Hide element appended to div on click?

Question

I am appeding a div withing some of div's on a web page using the following

var strScript = '<div class="' + cssClass + '" > ' + message + '</div>';
var notifyElement = $(strScript);

Now I want to set this appended div to be Disappeared when users click on that OnClick

Can I do something like this

notifyElement.OnClick(function .......

I can't select the element by passing the id coz there will be more than one div's of this type in a single page.

It's *well worth* your time spending an hour or two reading through [the jQuery API documentation](http://api.jquery.com). It really only takes that long, and it pays for itself in no time. — T.J. Crowder, Dec 31 '14 at 08:46
Possible duplicate of [Event binding on dynamically created elements?](https://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements) — Trikaldarshiii, Dec 04 '17 at 18:51

score 2 · Answer 1 · answered Dec 31 '14 at 08:46

2

Yes, just use the click function (or on):

notifyElement.click(function() {
    notifyElement.hide();
});

or

notifyElement.on("click", function() {
    notifyElement.hide();
});

or if you might use the notifyElement variable for something else in the future:

notifyElement.on("click", function() {
    $(this).hide();
});

answered Dec 31 '14 at 08:46

T.J. Crowder

by setting this everything within `notifyElement` will trigger this event? – Trikaldarshiii Dec 31 '14 at 08:48
1

@HIT: Yes, the `click` event bubbles. So unless you have an element within it that handles `click` and stops propagation, the notify element will see the click. – T.J. Crowder Dec 31 '14 at 08:48

score 1 · Answer 2 · answered Dec 31 '14 at 08:46

1

yep:

notifyElement.click(function() {
    $(this).hide();
});

or do it while creating:

$(notifyElement, {
    "click": function() {
        $(this).hide()   
    }
});

answered Dec 31 '14 at 08:46

Todd

2 Answers2