JSFiddle - React, Tailwind, and code Playground

HTML

<select id="TPReviewSort">
									<option value="" selected="" disabled="">Sort reviews</option>
									<option value="data-ratingvalue" data-order="H">Highest Rating</option>
									<option value="data-ratingvalue" data-order="L">Lowest Rating</option>
								<option value="data-upvotes" data-order="H">Most upvotes</option><option value="data-upvotes" data-order="L">Least upvotes</option></select>

<div class="col-1 zflex-ws" id="YP-productreviews">
   <div class="col-1 zflex-ws ctrPad16-t border1 removeborder-left removeborder-right removeborder-bottom YPReview" data-reviewid="15634232" data-ratingvalue="4" data-upvotes="8">
      <div class="col-4 ctrPad16 YPReview-reviewer">
         <div class="col-1 ctrPad8-bottom"><strong>Reviewed by:</strong><br> Benjamin Kippax</div>
         <div class="col-1 ctrPad8-bottom"><strong>Reviewed date:</strong><br>13-12-2017</div>
         <div class="col-1 ctrPad16-t zflex-ws">
            <div class="col-1 YPReview-upvotes"><span id="upv-51448747">8</span> Found this useful.</div>
         </div>
         <div class="col-1 transition YPReview-upvotenow" id="upvote-51448747"><span data-uptarget="upv-51448747" onclick="upvoteReview(51448747)"><span class="fa transition thumb"></span> &nbsp;Upvote review</span></div>
      </div>
      <div class="col-75p ctrPad16-lo">
         <div class="col-1 zflex-ws">
            <div class="col-1 ctrPad8-bottom fa"><span class="YPReview-score" data-score="4"></span></div>
            <div class="col-1 YPReview-title">Intentionally long product review title to make sure the title looks good even when it's long. Intentionally long product review title.</div>
            <div class="col-1 ctrPad16-t YPReview-content">Nec tempus eros maximus at. Duis lorem dolor, aliquam ut orci et, interdum ultrices augue. Curabitur accumsan, odio vel faucibus fringilla, arcu augue pretium est, quis consectetur purus orci eget erat.</div>
            <div class="col-1 ctrPad16-bo transition...

JavaScript

// Run function on select option change.
  $('#TPReviewSort').change(function() {
		var value = $(this).find(':selected').attr('value');
		var order = $(this).find(':selected').attr('data-order');
		DOYPSort('#YP-productreviews', '.YPReview', value, order);
	});
	
	// Parameters must be strings
	// Order of must be either 'H' (Highest) or 'L' (Lowest)
	function DOYPSort(wrapper, elementtosort, AttrToSort, orderof) {
		$(wrapper).find(elementtosort).sort(function (a, b) {
			if (orderof === 'H') {
				return +b.getAttribute(AttrToSort) - +a.getAttribute(AttrToSort);
			} 
			if (orderof === 'L') {
				return +a.getAttribute(AttrToSort) - +b.getAttribute(AttrToSort);
			}
		}).appendTo(wrapper);
	}