how to delete or hide a li

<li>ff<strong>foobar</strong><a class="icon-close" href="#."></a></li>
<li>ff<strong>foobar</strong><a class="icon-close" href="#."></a开发者_运维技巧></li>
<li>ff<strong>foobar</strong><a class="icon-close" href="#."></a></li>
<li>ff<strong>foobar</strong><a class="icon-close" href="#."></a></li>
<li>ff<strong>foobar</strong><a class="icon-close" href="#."></a></li>
<li>ff<strong>foobar</strong><a class="icon-close" href="#."></a></li>
<li>ff<strong>foobar</strong><a class="icon-close" href="#."></a></li>

On clicking the a, the respective li should be deleted.

$(.close-icon).hide(); hides every thing.

Should work, but haven't tested:

$("a.close-icon").click(function() {
  $(this).parent("li").hide();
});

$(".close-icon").click(function() {
    $(this).closest("li").remove();
});

This will not only hide the element, it will also remove it from the page.

try

hide:

$("a").click(function() {
  $(this).closest("li").hide(); 
 });

DEMO

remove :

 $("a").click(function() {
      $(this).closest("li").empty(); 
 });

OR

$("a").click(function() {
      $(this).closest("li").remove(); 
   });

Reference

• hide()
• remove()
• empty()

$(.icon-close).click( function() {
    $(this).parent().hide();
});

Do you mean this

 $('.close-icon').click( function (){ $(this).hide(); });

For hiding the entire parent

 $('.close-icon').click( function (){ $(this).parent('li').hide(); });

Also change .close-icon to '.close-icon'

for removing replace hide() by remove()

Presuming you want the li to hide / remove on click of the icon

 $('.close-icon').click(function(){
    $(this).parent('li').hide();
    });

or

$('.close-icon').click(function(){
$(this).parent('li').remove();
});

if you want to hide it

$('a.icon-close').click(function(){ 
   $(this).parent('li').hide();
});

If you want to delete it

$('a.icon-close').click(function(){
   $(this).parent('li').remove();
});

The filtering 'li' in .parent() is not strictly necessary in this case.

I have not tested, but code below should work, if I understood your requirement.

$(.close-icon).click(function(event){
event.preventDefault();
$(this).parent().remove(); //remove the parent OR 
   //$(this).parent().hide(); //hide the parent

 });

$("a.close-icon").click(function() {
  $(this).parent("li").remove();
  return false;
});