How to Remove All Li Element of Same Class Except First Li Element in Jquery or JavaScript

How to remove all li element of same class except first li element in jquery or javascript

you have to use remove() for remove any element . Try to use this :

$('.removeMe').each(function(index){
   if(index !=1)
       $(this).remove();
});

Hope this will help you

Hide all instances of LI except first in UL jQuery

You should use css selectors

$('.status-list').each(function() {
  $(this).children("li:not(:first-child)").hide();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="status-list">
  <li>list 11</li>
  <li>list 12</li>
  <li>list 13</li>
  <li>list 14</li>
  <li>list 15</li>
  <li>list 16</li>
</ul>

<ul class="status-list">
  <li>list 21</li>
  <li>list 22</li>
  <li>list 23</li>
  <li>list 24</li>
  <li>list 25</li>
  <li>list 26</li>
</ul>

jQuery/JavaScript: how to remove all elements in the first <li> except <a>text</a>

window.onload = function() {
    //declare an instance of DocumentFragment Type;
    var fragment = document.createDocumentFragment();
    var liList = document.getElementById("menu-item-38").querySelectorAll("li");
    for (var i = 0; i < liList.length; i++) {
        //copy these li into the fragment
        fragment.appendChild(liList[i]);
    }
    var removeObj = document.getElementById("menu-item-38");
    var parentElement = removeObj.parentNode;
    //remove li whose id id [menu-item-38]
    parentElement.removeChild(removeObj);
    //add fragment to the parmentElement
    parentElement.appendChild(fragment);
}

How to remove all li elements inside an ul except the first and the last elements using jQuery?

To remove from all ul-s on the page the li-s that are neither the first nor the last:

$('ul li:not(:first-child):not(:last-child)').remove();

Or using a specific id:

$('#yourul li:not(:first-child):not(:last-child)').remove();

If you have a jQuery object with your ul in it:

$(yourul).find('li:not(:first-child):not(:last-child)').remove();

How to hide all li except first two in one list, and third and fourth in another?

To show only the first two li you can use :gt(1) to get all the following li, then hide() them,

To show only the third and fourth li you can use not() in combination with :eq(2) and :eq(3) to hide() the unrequired ones. Try this:

$('#id_show12').click(function() {  $('.show12 li:gt(1)').hide();})$('#id_show34').click(function() {  $('.show34 li').not(':eq(2), :eq(3)').hide();})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><div class="show12">  <ul>    <li>1</li>    <li>2</li>    <li>3</li>    <li>4</li>  </ul></div><div class="show34">  <ul>    <li>1</li>    <li>2</li>    <li>3</li>    <li>4</li>  </ul></div>
<button id="id_show12">show only one/two</button><button id="id_show34">show only three/four</button>

How to remove active class from all li elements except one that clicked?

You can hook up an event handler on the dots. Within the event handler, this will refer to the element on which you attached the handler. Then you can remove the class from all the others:

var ul = document.querySelector('ul');var dots = [];
for (var i = 0; i < 5; i++) {  var dot = document.createElement('li');  dot.addEventListener("click", clickHandler); // ** Hook up the handler  dots.push(dot);  ul.appendChild(dot);}dots[2].setAttribute('class', 'active');
// Here's the handlerfunction clickHandler() {  var dots = document.querySelectorAll("li");  for (var n = 0; n < dots.length; ++n) {    if (dots[n] !== this) {      dots[n].className = "";    }  }  this.className = "active";}

li {  width: 20px;  height: 20px;  background-color: lightgrey;  text-decoration: none;  display: inline-block;  border-radius: 100%;  margin-right: 15px;}
.active {  background-color: grey;}

<ul></ul>

jQuery - removeClass() applied to all classes except one

Your selector was written wrongly, I'm assuming this was a typo resulting from a later edit of the selector, given the misplaced ) character. So, rather than:

$("#list li:not(li:nth-child(2) a)").removeClass("active");

Instead use:

$("#list li:not(li:nth-child(2)) a").removeClass("active");

Your original selector was looking for an <li> element that was not the second-child of its parent and, also, was not an <a> element; this is true for all <li> elements.

/*Remove ".active" from all the anchors except child number 2 */$("#list li:not(li:nth-child(2)) a").removeClass("active");

<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>

<style>  .active {    color: red;  }</style>

<div id="list">  <ul>    <li><a class="active" href="#">One</a></li>    <li><a class="active" href="#">Two</a></li>    <li><a class="active" href="#">Three</a></li>  </ul>
</div>

removeClass from all other elements except the target parent

You can move the remove class to bottom and exclude the current item

$('html').click(function(e) {  var $curr;  if ($(e.target).parent().hasClass('parent-item')) {    e.preventDefault();    $curr = $(e.target).parent().toggleClass('open');  }  $('.parent-item.open').not($curr).removeClass('open');});

.parent-item > ul {  display: none;}.parent-item.open > ul {  display: block;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><ul>  <li class="parent-item">    <a href="#">Link</a>    <ul>      <li><a href="#">Child</a>      </li>      <li><a href="#">Child</a>      </li>      <li><a href="#">Child</a>      </li>    </ul>  </li>  <li><a href="#">Link</a>  </li>  <li class="parent-item">    <a href="#">Link</a>    <ul>      <li><a href="#">Child</a>      </li>      <li><a href="#">Child</a>      </li>      <li><a href="#">Child</a>      </li>    </ul>  </li></ul>

jQuery select all except first

$("div.test:not(:first)").hide();

or:

$("div.test:not(:eq(0))").hide();

or:

$("div.test").not(":eq(0)").hide();

or:

$("div.test:gt(0)").hide();

or: (as per @Jordan Lev's comment):

$("div.test").slice(1).hide();

and so on.

See:

http://api.jquery.com/first-selector/
http://api.jquery.com/not-selector/
http://api.jquery.com/gt-selector/
https://api.jquery.com/slice/

How to Remove All Li Element of Same Class Except First Li Element in Jquery or JavaScript