javascript - jQuery: What is wrong here? -

this first question here. first of have @ code

 $("body").on("click", "#showstore", function() {     $('#foo a[href="' + $('.container').children('a').attr('href') + '"]').remove();  }); 

html

<div id="showstore">button</div> <div id="foo">   <a href="http://jsfiddle.net/">hello</a>   <a href="http://google.com/">okay</a> </div> <div class="container">   <a href="http://jsfiddle.net/">bye</a>   <a href="http://google.com/">see</a> </div> 

on clicking '#showstore' first 'a' being removed. how can make remove matched 'a' #foo?

jsfiddle :: http://jsfiddle.net/xr3gjvxx/27/

selector in code targeting anchor tags under #foo, has changed anchor tags.

change

$('#foo a[href="' + $('.container').children('a').attr('href') + '"]').remove(); 

to

$('a[href="' + $('.container').children('a').attr('href') + '"]').remove(); 

update - 1

your code trying remove anchor tags under #foo having href="http://jsfiddle.net/" 1 in code above , gets removed. if trying remove anchor tags under #foo irespective or href value, try

$('#foo a').remove(); 

update - 2

ok if need loop on each child , remove anchor tags, try

$( "body" ).on( "click", "#showstore", function() {      $('.container').children('a').each(function(){          $('#foo a[href="' + $(this).attr('href') + '"]').remove();      });  }); 

here a sample fiddle.