title: Button Click not working After Ajax call in bootstrap modal
body: <p>Button is working before ajax call in bootstrap Modal.
  But After Ajax call click event is not working.</p>
  
  <pre><code>function book_appointment_timeslot(job_id,planner_date,time_slot,contract_id){    
         $.ajax({
                    type: "POST",
                    url: "/add_appointment_planner",
                    data: { contract_id: contract_id,job_id : job_id,  planner_date: planner_date, time_slot: time_slot, _token: CSRF_TOKEN },  
                    success: function(data){
                           if(data['status']=='success')
                           {
                                  show_notification(data['status'],data['message']);
                                  $("#apt_status_table").load(location.href + " #apt_status_table");
                                  $(".tbl_planner_list_whole").load(location.href + " .tbl_planner_list_whole");
  
                           }
                    }
      });
  }
  </code></pre>
  
  <p>I Have tried below solutions ,</p>
  
  <p>Solution-1 :-</p>
  
  <pre><code>$(document).on('click', '.appointment_edit_button', function(){
      alert("success");
  });
  </code></pre>
  
  <p>Solution-2 :-</p>
  
  <pre><code>$(document).delegate('click', '.appointment_edit_button', function(){
      alert("success");
  });
  </code></pre>
  
  <p>I tried with <code>unbind()</code> also. It also not working.
  When I put script directly in Console. Then it's working. So may be it's due to bootstrap modal.</p>
  
  <p>So, I want to <strong>enable button click event after ajax call in bootstrap modal</strong>.</p>
  
  <p>EDIT :- </p>
  
  <p>HTML Code :- </p>
  
  <pre><code>&lt;tbody&gt;
      &lt;tr&gt;
                              &lt;td&gt;
                                  &lt;div class="agenda-date"&gt;
                                      &lt;div class="dayofmonth color_font_date"&gt;2017-06-01&lt;/div&gt;
                                      &lt;div class="dayofweek"&gt;
                                          thursday                                            &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                                  &lt;div class="row margin_two_planner"&gt;
                                          &lt;button type="button" class="btn btn-sm btn-primary" onclick="book_appointment_timeslot(19,&amp;quot;2017-06-01&amp;quot;,
                                              1,43)"&gt;am &lt;/button&gt; 
                                          &lt;a data-toggle="modal" href="#add_apt_status" class=""&gt;&lt;input type="number" value="8" name="" class="number_planner"&gt;&lt;/a&gt;
                                          &lt;input type="number" value="9" name="" class="max_limit" disabled=""&gt;
                                          &lt;input type="hidden" value="am" name="" class="timeslot_max_limit" disabled=""&gt;
                                  &lt;/div&gt;
                                  &lt;div class="row margin_two_planner"&gt;
                                          &lt;button type="button" class="btn btn-sm btn-primary" onclick="book_appointment_timeslot(19,&amp;quot;2017-06-01&amp;quot;,
                                              2,43)"&gt;pm &lt;/button&gt; 
                                          &lt;a data-toggle="modal" href="#add_apt_status" class=""&gt;&lt;input type="number" value="6" name="" class="number_planner"&gt;&lt;/a&gt;
                                          &lt;input type="number" value="5" name="" class="max_limit" disabled=""&gt;
                                          &lt;input type="hidden" value="pm" name="" class="timeslot_max_limit" disabled=""&gt;
                                  &lt;/div&gt;
                              &lt;/td&gt;
                              &lt;td style="width: 20%;"&gt; 
                                      &lt;textarea id="" class="form-control initial_cap appointment_note" required="required" rows="3" name="appointment_note" cols="50" aria-required="true" disabled=""&gt;       asdsad             &lt;/textarea&gt;
                              &lt;/td&gt;
                              &lt;td style="width: 20%;"&gt; 
                                  &lt;textarea id="" class="form-control initial_cap holiday_note" required="required" rows="3" name="holiday_note" cols="50" aria-required="true" disabled=""&gt;       asasdsaddsad        &lt;/textarea&gt;
                              &lt;/td&gt;
                              &lt;td&gt;
                              &lt;div class="text-right"&gt;
                                      &lt;input type="hidden" class="planner_date" name="" value="2017-06-01"&gt;
                                      &lt;input type="hidden" class="contract_id" name="" value="43"&gt;
                                      &lt;button type="button" id="" class="btn btn-primary appointment_edit_button"&gt;edit &lt;/button&gt;
                                      &lt;button type="button" id="" onclick="planner_note_edit(10,event)" class="btn btn-md btn-primary appointment_update_button" style="display:none"&gt; update &lt;/button&gt;
                                      &lt;button type="button" id="" class="btn btn-md btn-cancel appointment_cancel_button" style="display:none"&gt;cancel &lt;/button&gt;
                              &lt;/div&gt;
                              &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p>Through this appointment_edit_button class I'm doing this process.</p>
  
  <pre><code>$(".appointment_edit_button").on("click",function(event) {   
          $(this).closest('tr').find(".appointment_note").prop("disabled", false);
          $(this).closest('tr').find(".holiday_note").prop("disabled", false);
          $(this).closest('tr').find(".max_limit").prop("disabled", false);
          $(this).next('button').show();
          $(this).next('button').next('button').show();
          $(this).hide();
  });
  </code></pre>
  
  <p>I looks like. 
  <a href="https://i.stack.imgur.com/fn7eg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fn7eg.png" alt="enter image description here"></a></p>