IE7/IE8 Javascript error on jQuery .remove()

Everything working in Firefox/Chrome/etc. but in IE7 & IE8 I'm getting an error on the jQuery .remove() (v=1.5.2) function. The IE error is:

Object does not support this property or method.

The list element gets generated via jQuery using the following code:

var add_term = $(this).text();
var new_list_element = $('<li><span><input name="med[' + count + ']" class = "new_med_field" value="' +add_term +'" readonly="readonly"></span></li>').hide();
$('div#create_right form ul').append(new_list_element);

I'm then trying to remove the same element (on click) using the following:

var $tgt ='';
$('#create_right form').click(function(event){
    $tgt = $(event.target);
    //Remove different portions depending on which element is selected
 开发者_如何学C   if ($tgt.is('li') || $tgt.is('span') || tgt.is('input[class="new_med_field"]')) {
        $tgt.closest('li').remove();
        count--;        
    }
});

Link to the site: http://refillwizardstage.heroku.com/refill/create

I would like to say it's a bug. There is an unhandled exception in sizzle, it only happens in browsers not supporting querySelectorAll (like IE7 or IE8+ in compatibility mode) .

The attribute-handler for type receives an argument that is not an element-node(in this case it's an DOMDocumentFragment, looks like a copy of the removed node, that doesn't have a method getAttribute).

As long as your function seems to work like expected you may catch this error.

Put this right after the embedded jquery.js-file:

<script>
 jQuery.find.selectors.attrHandle.type=function( elem ) {   
       try{return elem.getAttribute( "type" );}catch(e){return'';}
    }
</script>

(Of course that's not a really proper way, but I can't tell you why this call with DocumentFragment happens, maybe somebody else will find it out)

I think the problem is that you are using event.target. Try using just $tgt = $(this) or var crossBrowserTarget = event.target ? event.target : event.srcElement; $tgt = $(crossBrowserTarget);

for example:

![enter image description here][1]

with "$('.item').remove();" it dosen't work well,but use "$('#bgright').children().remove();" It is because IE8 or lt isen't support querySelectorAll well.But it's supported in some speacial situations.

enter code here:<section id="bgright">
                      <div class="item"></div>
                      <div class="item"></div>
                </section>