javascript - cancel button in modal popup not working -

javascript - cancel button in modal popup not working -

i have view gets ajax partial view , shows modal popup. problem is, partial view has cancel button on id attribute, .click javascript event attached main view. this:

main view

<div> some_ajax_link </div> <div id="partial_container"></div> <script> $(document).ready(function () { $('ajax_link').click(function (e) { var hiddensection = $('#partial_container'); hiddensection.fadein() // unhide section.hidden .css({ 'display': 'block' }) // set total screen .css({ width: $(window).width() + 'px', height: $(window).height() + 'px' }) .css({ top: ($(window).height() - hiddensection.height()) / 2 + 'px', left: ($(window).width() - hiddensection.width()) / 2 + 'px' }) // greyed out background .css({ 'background-color': 'rgba(0,0,0,0.5)' }); }); }); $('#partial_container').on('click', '#close_button', function () { $('#partial_container').fadeout(); }); </script>

partial

<div> stuff </div> <button id="close_button">cancel</button>

the reason have cancel button in partial styling purposes, when button in main view works fine reason. i'm confused because when partial retrieved ends on same page

edit

not sure why theres .appendto('body'), got script somewhere online, necessary?

$('#partial_container').on('click', '#close_button', function () { $('#partial_container').fadeout(); });

javascript jquery ajax