Question

I am trying to remove a button from a list and for some reason the function doesn’t seem to be working correctly. It seems to be some type of problem with the selector, because if I use the ‘id’ selector for the ‘ul’ it works just fine. But when I change it to the class selector for the ‘li’ within the list it no longer works. Does anyone have an idea what this might be?

Thanks in advance for your help with this.

$('#courses').append('<li class="plan" data-icon="delete"><a>'+in_course+' Credit: '+in_hrs+' Grade: '+ in_gpa+'</a></li>').listview('refresh');


$(document).ready(function(){
    $('.plan').on('click',function() {
         $(this).parent().remove();
    }); });

Answer 1

Maybe this works for you:

$(document).ready(function(){
  $('.plan a').on('click',function() {
     $(this).parent().remove();
  });
});

or

$(document).ready(function(){
  $('.plan').on('click',function() {
     $(this).remove();
  });
});

Using your code will remove #courses