Delete only works once

Question

I'm having an issue with this piece of code.

 if (attributeName == 'id') 
  {
    var loadUrl = "http://localhost:8000/OB_ViewDetails/";
    $.ajaxSetup ({
      cache: false
      });

    $("#discard").click(function(){
      var id = dataValue;
      // alert(id);

      $.ajax({
        url: 'deleteob/' + id
        // success:alert
      }).done(function(data){

        $("#obfull").load(loadUrl + ' #obfull > *', function(responseText) {
          if(responseText != '') $('#msg').append('<p class="alert alert-success">delete successful</p>')
          .children().delay(2000).fadeOut('slow');
        });

      });

    });

  }

Using the .load function from jQuery. The problem is that my data works only on the first call, but not on the 2nd one.

I use this to delete the selected item from the list. from the modal.

What I want is to continue the process of deleting the selected list items.

Answer 1

Delegate you click event

$("body").on("click","#discard",function() {

var id = dataValue;
      // alert(id);

      $.ajax({
        url: 'deleteob/' + id
        // success:alert
      }).done(function(data){

        $("#obfull").load(loadUrl + ' #obfull > *', function(responseText) {
          if(responseText != '') $('#msg').append('<p class="alert alert-success">delete successful</p>')
          .children().delay(2000).fadeOut('slow');
        });

      });
 });