Question

114

jQuery select dynamically created html element

rated 0 times [ 116] [ 2] / answers: 1 / hits: 50143 / 12 Years ago, mon, april 23, 2012, 12:00:00

There are a lot of asked questions with almost similar titles with this question of mine, but you know I didn't find an answer.

My simple question is:
I have button, when I click on it, javascript creates modal window

<div class=aui-dialog>

     html here... 

     <button id=closeButton>Close</button>

</div>

just after <body> tag.

I can bind click event of close button with no problem using jQuery live:

$(#closeButton).live(click, function() { 

    alert(asdf); // it calls

    $(body).find(.aui-dialog).remove();

});

My problem is, I cannot select that dynamically created modal window div by its classname. So that I could call jQuery .remove() method to make close action. Now I know, I must deal with dynamic elements in another way.

What way?

EDIT:

I think it's important to mention this:

I dont' create the modal window myself, I use liferay portal. It has built-in javascript framework AUI(YUI) that creates that modal window. I can just create that close button inside it in its view.

EDIT 2:

Modal window div class attribute value is: aui-component aui-panel aui-dialog aui-widget-positioned

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

tristab

Add To Favorites

Follow

Total Points: 735

Total Questions: 106

Total Answers: 96

Location: Grenada

Member since Sun, Dec 20, 2020

3 Years ago

tristab questions

1 How to use the new Webpack devServer configuration?

Sat, Sep 25, 21, 00:00, 3 Years ago

1 Discord.JS get member from user ID

Sun, Jan 31, 21, 00:00, 3 Years ago

1 React: Passing Props not working. What am I missing?

Wed, Dec 2, 20, 00:00, 4 Years ago

1 How can i extract vowels in a Javascript String?

Fri, Oct 23, 20, 00:00, 4 Years ago

1 Jest encountered an unexpected token when testing a Vue single file component

Sat, May 23, 20, 00:00, 4 Years ago

View All

answered 12 Years ago brandensebastiand · Accepted Answer

~~Create a reference when you're creating the modal window:~~

var modalWindow = $('<div class=aui-dialog>html here... <button id=closeButton>Close</button></div>');

// later...

modalWindow.remove();

To your edit:

Get the window via jQuery's parent when the button is inside the modal window:

$('#closeButton').on('click',function() {

    $(this).parent().remove();

    return false;

});