CODEWITHSUNDEEP
jqueryhtml
Edward
Edward

Reputation: 3091

remove li element from html entirely

I have an HTML list like below, im trying to remove all the li's from it, entirely. I'm using Jquery to achieve this effect. However it's not having the effect I desired, it's not actually removing the li from the DOM it's just setting it's display state to hidden:

<li style="display: none;"> </li>

Jquery

 var size = parseInt($(".thumbs li").size(),10);
 for( var i=0; i< size; i++) {
    var src = $('.thumbs li:nth-child('+i+')').remove();    
 }

HTML

<ul class="thumbs noscript">
 <li>
  <a class="thumb" name="leaf" href="" title="Title #0">
     <img src="" alt="Title #0"/>
  </a>
  <div class="caption">
     <div class="download">
        <a href="">Download Original</a>
     </div>
     <div class="image-title">Title #0</div>
     <div class="image-desc">Description</div>
  </div>
 </li>

Upvotes: 0

Views: 83

Answers (1)

keithjgrant
keithjgrant

Reputation: 12769

$(".thumbs li").remove();

You don't need that loop. (But just for clarification, your problem in the loop is that you're removing elements as you go, so halfway through, nth child elements no longer exist in the DOM)

Upvotes: 2

Related Questions