Aariba Aariba - 7 months ago 12
HTML Question

Conditionally delete Node of HTML by JS

Trying to delete specific HTML Node of specific div. Delete all

.widget-content li.lists
if there more then one
li.lists
(there will be mane list item), but don't want to delete first child
li.lists:first-child
, means keep first-child.

HTML:

<div class="wrapper delete">

<div class="widget-content">
<ul>
<li class="lists">
Content First
</li>
<li class="lists"> <!-- Delete this-->
Content second
</li>
<li class="lists"> <!-- Delete this-->
Content third
</li>
</ul>
</div>

</div>


jQuery:

$('.widget-content li').not(':first-child').remove();


I have used this jQuery, but I want to do this conditionally by if statement. Mean if there have more then one
li:lists
then delete all
li:lists
with out first list
li.lists:first-child
.

Note: want to this by If statement.

JS Fiddle

Example

Answer
    $(document).ready(function() {
    var numItems = $(".widget-content li").length; //or whatever class/id you want to count
   if (numItems > 1){
       $('.widget-content li').not(':first-child').remove();
   }
});

Fiddle: http://jsfiddle.net/qwc6h1y2/7/