Home/ Questions/Q 873203
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-15T10:53:48+00:00

i have write this block of code in jquery to create three element after

  • 0

i have write this block of code in jquery to create three element after some events 

$('body').append(
tmp= $('<div id="tmp"></div>')
);

$('<div id="close" />').appendTo("#tmp");   
$('<div id="box-results" />').appendTo('#tmp');

this three elements are created normally and added to my DOM but i want to remove them with some function like this : 

$("#close").click(function(e){

e.preventDefault();
$("#tmp").remove(); 
//$("#overlay").remove(); 
});

and after i click close div noting happen ! what’s wrong with my code ?

here is online example : mymagazine.ir/index.php/main/detail/36 – please find ” here is jquery issue” sentence in site because site language is Persian

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    you need to add the click handler on #close after you insert the element into the document.

    edit providing the requested demo; tested in ff36:

    <html>
<head>
 <title>whatever</title>
 <style type="text/css">
   div {
     border: 1px solid black;
     padding: 0.3em;
   }
 </style>
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
 <script type="text/javascript">
  $(document).ready(function ()
  {
    $('body').append($('<div id="tmp"/>'));
    $('<div id="close">click me</div>').appendTo("#tmp");   
    $('<div id="box-results">contents</div>').appendTo('#tmp');
    $('#close').bind('click', function ()
    {
      $('#tmp').remove();
      return false;
    });
  });
 </script>
</head>
<body>
</body>
</html>

    edit

    change your plugin’s code from

    $.ajax({
    ...
    success: function ()
    {
        $('<div id="close"/>').appendTo($('#tmp'));
    }
});
$('#close').click(function (e) ...);

    to

    $.ajax({
    ...
    success: function ()
    {
        $('<div id="close"/>')
            .click(function (e) ...)
            .appendTo($('#tmp'))
        ;
    }
});
    • 0