Call jQuery function when element appears after page load -

Call jQuery function when element appears after page load -

i'm using jquery extension gives custom scroll bars. called this:

$("#thoughtsarticle #recentposts").mcustomscrollbar();

but in case element needs affected doesn't exist when page loads. appears result of user input. how can execute jquery when element appears on page?

from googling i've figured out need utilize delegated events i've not found examples straight apply in case. examples events form submission etc.

edit:

i don't think i've explained i'm looking for. if @ webpage here, when page loads, 'blog' section doesn't exist. if click on blog in navigation bar, reload section of page using ajax. see on blog section have recent posts block on right. want apply custom scroll bar section.

the code posted above in $(document ).ready() script rest of jquery, target element doesn't exist on page load, custom scroll bar not applied.

i've tried putting <script> tag on blog page above jquery, doesn't seem have effect.

i've searched bit on net , think need utilize delegated event? not sure either way don't know how utilize in case none of examples find seem apply in case.

this script fire when document loaded. add together delegate on document apply .mcustomscrollbar(); bit concerned fire 'ready' after point thought, seek other lifecycle event, or apply without delegation immediately, command on page after document ready.

$(function(){ $(document).on('ready','#thoughtsarticle #recentposts',function(){ $(this).mcustomscrollbar(); }) })

jquery