JSFiddle - React, Tailwind, and code Playground

by Udhay

HTML

<script src="http://knockoutjs.com/downloads/knockout-3.2.0.js"></script>
<!-- ko foreach: arrayLsit -->
<div data-bind="text: citation"></div>
<!-- /ko -->

JavaScript

var ViewModel = function() {
  var self = this;

  this.arrayLsit = ko.observabelArray();

  allBooks = [{
    citation: 'Zen'
  }, {
    citation: 'zen'
  }, {
    citation: 'aen'
  }, {
    citation: 'Aen'
  }, {
    citation: 'Cen'
  }, {
    citation: 'cen'
  }, {
    citation: ' Zen'
  }, {
    citation: '#Zen'
  }];
  var sortedList = allBooks.sort(function(a, b) {
    var regex = /(\s*<([^>]+)>)/ig;
    var aCitation = a.citation.replace(regex, "");
    var bCitation = b.citation.replace(regex, "");
    var alc = aCitation.toLowerCase(),
      blc = bCitation.toLowerCase();
    return alc > blc ? 1 : alc < blc ? -1 : 0;
  });
  this.arrayLsit.push.apply(this.arrayLsit, sortedList);
};
ko.applyBindings(new ViewModel());