$(this).parent().remove(); not working in IE

Question

Any ideas why the code below wouldn't work in IE, yet in FF and Chrome it does:

$(".remove", document.getElementById("ccusers")).live("click", 
  function () {
     $(this).parent().remove();
  });

If I try:

alert($(this).parent().attr("id"));

I get the id alerted out in FF & Chrome but not IE.

Any ideas what needs to be done differently?

Answer 1

$(".remove, #ccusers").bind("click", function () {
    $(this).parent().remove();
});

To make shure you are removing the right parent element up in the tree and its children you can try this:

$(this).parents('theParentYouWantToRemove').remove();

You may find this useful: What is the difference between the bind and live methods in jQuery?

P.S. I suggest you to use only $('.remove') , as I don't see any reason why you are doing $('.remove, #ccusers'), as it will actually mean:
elements.remove OR element #ccusers,

And by doing: $('.element' , '#element') (look at the quotes!) your 'second' element will do absolutely NOTHING ! (like many here suggested).

So my only valid suggestion would be:

$(".remove").bind("click", function () {
    $(this).parents('#ccusers').remove(); // or .parent() as I explained above
});

DEMO jsBin

(download and try in IE)

Answer 2

html

<div id="ccusers">
    <span>User1</span>
    <span>User2</span>
    <div class="remove">Remove</div>
</div>

js

$(".remove", "#ccusers").live("click", function() {
     $(this).parent().remove();
});

Works fine for me in IE7, see the fiddle: http://jsfiddle.net/c4urself/NrKRF/

Answer 3

If you are gunna use jQuery. Use jQuery:

 $(".remove", "#ccusers").live("click", function () {
       $(this).parent().remove();
 });