JSFiddle - React, Tailwind, and code Playground

by prodac

HTML

<h2>Product Name</h2>
<div id="cat_description">
    <div id="list">
        <ul id="{tag_position this document}" class="list_item">
            <li class="source_ahref"><a href="#Link1">This is the Source Link</a></li>
            <li class="text">Support Document 1&nbsp;
                <a class="target_ahref" href="#">Read Document</a>
            </li>
            <li class="count">Alpha</li>
            <li class="timestamp">105322</li>
        </ul>
        
        <ul id="{tag_position this document}" class="list_item">
            <li class="source_ahref"><a href="#Link2">This is the Source Link</a></li>
            <li class="text">Support Document 4&nbsp;
                <a class="target_ahref" href="#">Read Document</a>
            </li>
            <li class="count">Charlie</li>
            <li class="timestamp">105324</li>
        </ul>
        
        <ul id="{tag_position this document}" class="list_item">
            <li class="source_ahref"><a href="#Link3">This is the Source Link</a></li>
            <li class="text">Support Document 2&nbsp;
                <a class="target_ahref" href="#">Read Document</a>
            </li>
            <li class="count">Alpha</li>
            <li class="timestamp">105325</li>
        </ul>
        
        <ul id="{tag_position this document}" class="list_item">
            <li class="source_ahref"><a href="#Link4">This is the Source Link</a></li>
            <li class="text">Support Document 3&nbsp;
                <a class="target_ahref" href="#">Read Document</a>
            </li>
            <li class="count">Beta</li>
            <li class="timestamp">105323</li>
        </ul>
        
    </div>
</div>

JavaScript

//jQuerySort
jQuery.fn.sortBy = function() {
    var selectors = arguments;

    this.sort(function(a, b) {
        // run through each selector, and return first non-zero match
        for (var i = 0; i < selectors.length; i++) {
            var selector = selectors[i];

            var first = $(selector, a).text();
            var second = $(selector, b).text();

            var isNumeric = Number(first) && Number(second);
            if (isNumeric) {
                var diff = first - second;
                if (diff != 0) {
                    return diff;
                }
            }
            else if (first != second) {
                return first < second ? -1 : 1;
            }
        }

        return 0;
    });

    this.appendTo(this.parent());

    return this;
};

//Pulling and Placing ahref
$(".source_ahref a").each(function() {
    var theHref = $(this).attr("href");
    $(this).parent().next().children('.target_ahref').attr("href", theHref);
});

//Sorts Documents by Position and Rating
//Solution provided by Pavel_Nedved (http://www.tswinteractive.ca)
$('#list .list_item').sortBy('.count', '.timestmap');