How to delay a jQuery function?

Question

I am trying to make the following happen:

I have a button that when clicked appends a new div element to the current elements.

I would like to do something to this new div right after it is created, how can I do that? Currently I am trying to hide it when the "add div button" is clicked, like so:

$(document).on('click', '.add_button', function() {

         $('.new-div').hide();

    });

But it doesn't work, as I think this code may be trying to do that before the div is appended. The "add div button" is in the backend and I don't have access to the code, so I just want my function to load slightly delayed (if it is infact timing the problem).

Answer 1

Then try it with setTimeout:

$(document).on('click', '.add_button', function() {

     window.setTimeout(function() { $('.new-div').hide() }, 1000); // 1000ms

});