26598

how do I sort li tag using ul tag in JQuery? [duplicate]

Question:

This question already has an answer here:

<ul><li> <a href="/questions/7211704/jquery-order-by-date-in-data-attribute" dir="ltr" rel="nofollow">jQuery order by date in data attribute</a> <span class="question-originals-answer-count"> 3 answers </span> </li> <li> <a href="/questions/304396/what-is-the-easiest-way-to-order-a-ul-ol-in-jquery" dir="ltr" rel="nofollow">What is the easiest way to order a <UL>/<OL> in jQuery?</a> <span class="question-originals-answer-count"> 3 answers </span> </li> </ul> <ul id ="sort"> <li id = '2014-02-07'>tralala<li> <li id = '2013-02-09'>tralala<li> <li id = '2014-01-04'>tralala<li> <li id = '2011-09-05'>tralala<li> </ul>

I want that the result to be :

<ul id ="sort"> <li id = '2014-02-07'>tralala<li> <li id = '2014-01-04'>tralala<li> <li id = '2013-02-09'>tralala<li> <li id = '2011-09-05'>tralala<li> </ul>

I want to sort desc the li using the id in JQuery or Javascript . Thx

Answer1:

You could do this :

var list = $('#sort'), items = list.children().get(); list.append(items.sort(function(a, b){ return new Date(b.id) - new Date(a.id); }));

Here is a demo : <a href="http://jsfiddle.net/wared/EE5HB/" rel="nofollow">http://jsfiddle.net/wared/EE5HB/</a>.

Recommend

  • Load External Class from content in another sandbox
  • AngularJS class ng-scope is not being added
  • Carousel bootstrap doesn't work
  • Can't use openlayers-3 with webpack
  • acts_as_taggable_on Tags added twice
  • Touch events over two dom elements?
  • JQuery Add class to certain list item
  • Jquery Show & ScrollTop (or ScrollTo)
  • ng-repeat not working with table but works with list
  • Function JavaScript : on Menu CSS HTML
  • Can't delete li from to-do list
  • C++ cout and enum representations
  • Cut the background to expose the layer below
  • Jquery popup on mouse over of calendar control
  • Ajax calls do not work in IE unless you fiddle with security settings
  • Detect when Facebook like button is clicked
  • How do I pass the string value parameter of the selected list item from an auto-populated dropdown l
  • Is it possible to access block's scope in method?
  • jQuery .attr() and value
  • How to clear text inside text field when radio button is select
  • Get data from AJAX - How to
  • Using jQuery closest() method with class selector
  • Email format validation in mvc3 view
  • Why doesn't :active or :focus work on text links in webkit? (safari & chrome)
  • jQuery tmpl and DataLink beta
  • Jquery - Jquery Wysiwyg return html as a string
  • How to disable jQuery.jplayer autoplay?
  • Rails 2: use form_for to build a form covering multiple objects of the same class
  • CSS Applying specific rule for a specific monitor resolution with only CSS is posible?
  • Setting background image for body element in xhtml (for different monitors and resolutions)
  • How to stop GridView from loading again when I press back button?
  • How to get Windows thread pool to call class member function?
  • IndexOutOfRangeException on multidimensional array despite using GetLength check
  • Does armcc optimizes non-volatile variables with -O0?
  • costura.fody for a dll that references another dll
  • Observable and ngFor in Angular 2
  • How to Embed XSL into XML
  • UserPrincipal.Current returns apppool on IIS
  • Conditional In-Line CSS for IE and Others?
  • java string with new operator and a literal