Hejka przedszkolacy!
To znowu ja, ten beznadziejny phpamator z kolejnym beznadziejnym problemem. (chyba powinienem zmienić nick z "phpamator" na "beznadziej")
Otóż kod tworzący listę który dostałem w spadku jest tak skonstruowany, że żeby w jakiś sensowny sposób go poukładać musiałbym go napisać chyba od zera toteż postanowiłem zajść go "od tyłu" albo może raczej od przodu czyli zamiast grzebać w kodzie zmienię kolejność po stronie przeglądarki.
Zacząłem więc od wyszukania wszystkich niezbędnych elementów no i wrzuciłem je do tablicy.
Nie mogę sobie jednak poradzić z samym ich ułożeniem w/g np pierwszej litery nazwy.

[HTML] pobierz, plaintext 
    jQuery(document).ready(function(){
		var alfa = [];
		function order(){
			var alfaArr = [];
			jQuery('.layered-navigation,.option-block').each(function(){
				alfaArr.push(jQuery('.layered_navigation,.option-block', this).html());
				alfaArr.push(jQuery(this));
				alfa.push(alfaArr);
				//tu pojawia się problem z sortowaniem
				//tu znajduje się nazwa po której chciałbym poukładać elementy: jQuery('.layered_navigation,.option-block').find('div span').html();
				//ale nie mam pojęcia jak to zrobić :)
				alfa.sort();
			})
		}
		// na kliknięcie uruchamiam funkcję order() która wybiera elementy i ładuje je nieuporządkowane do tablicy alfaArr
		jQuery('#alfaBtn').on('click', function(){
			order();
			// wrzucam spowrotem elementy do diva "filter-block"
			for(var i=0; i<alfa.length; i++){
				jQuery('#filter-block').append(alfa[i][1]);
			}
			// Po wykonaniu czyszcze tablice
			alfa = [];
		})
	});
[HTML] pobierz, plaintext 

tu przykład jak wygląda jeden z elementów: (pogrubione to moja wartość w/g której chciałbym posortować)

[HTML] pobierz, plaintext 
	<div childblock_id="price" class="odd option-block-head toggle-block" style="cursor: pointer;">
		<span class="filter-title">Cena</span><span class="open-close">+</span>
		<div> tu jeszcze trochę zawartości ale tylko do pokazywania jeśli potrzebna :) </div>
	</div>
[HTML] pobierz, plaintext 

W tej chwili każdorazowe kliknięcie powoduje tylko przesuwanie się listy czyli to co jest na początku po kliknięciu przechodzi na koniec i tak mogę sobie klikać i patrzeć jak mi się przesuwają elementy po ekranie

Podpowiedzcie jak to zrobić proszę.

Tutaj masz sort

https://www.w3schools.com/jsref/jsref_sort.asp

https://stackoverflow.com/questions/6712034...y-in-javascript

Nie jest to raczej trudne

Niby tak, ale kiedy masz w tablicy taki kogiel mogiel ..... ?
Jak mam wskazać co jest a a co jest b ?

Widziałeś zawartość mojej tablicy ?

Muszę nad tym chwilę pomysleć
...

https://stackoverflow.com/questions/7831712...tml-of-children

Patrzę, patrzę ...... nie kumam ...... czyli co, ten mój kod mogę sobie darować ....

Najlepiej gdybyś na początek ustalił co jest kompletnym blokiem.
W pierwszym przykładzie pokazałeś inną strukturę niż w ostatnim. I nie mam tu na myśli pełnej zawartości pokazanej w drugim przykładzie.

W dużym uproszczeniu wygląda to tak:

[HTML] pobierz, plaintext 
<!-- ten div można przyjąć będzie parent-->
<dl class="filter-block">
 
<!-- a te będą dziećmi-->
<div class="layered_navigation option-block">
  <div childblock_id="Two_Way_Talk" class="odd option-block-head toggle-block" style="cursor: pointer;">
    <span class="filter-title">Two-Way Talk</span>
    <span class="open-close">+</span>
  </div>
</div>
 
<div class="layered-navigation option-block">
  <div childblock_id="price" class="odd option-block-head toggle-block" style="cursor: pointer;">
    <span class="filter-title">Price</span>
    <span class="open-close">+</span>
  </div>
</div>
 
<div class="layered-navigation option-block">
  <div childblock_id="manufacturer" class="odd option-block-head toggle-block" style="cursor: pointer;">
    <span class="filter-title">Brands</span>
    <span class="open-close">+</span>
  </div>
</div>
 
</dl>
<hr/>
<button id="sPrice" class="btnSort">Sort</button>
[HTML] pobierz, plaintext 

pokazuje mi już kolejne selektory ale jeszcze nie sortuje.

[HTML] pobierz, plaintext 
function sortUsingNestedText(parent, childSelector, keySelector) {
		console.log(keySelector);
    var items = parent.children(childSelector).sort(function(a, b) {
        var vA = $(keySelector, a).text();
        var vB = $(keySelector, b).text();
        console.log('vA'+vA+' '+'vB'+vB)
        return (vA < vB) ? -1 : (vA > vB) ? 1 : 0;
    });
    parent.append(items);
 
}
/* setup sort attributes */
$('.layered-navigation,.option-block').each(function(){
	sortUsingNestedText($('.filter-block'), ".layered-navigation,.option-block", $(this).find('div').attr('childblock_id'));
})
[HTML] pobierz, plaintext 

Temat zamknięty, zrobiłem

[HTML] pobierz, plaintext 
jQuery(document).ready(function(){
	function sortUsingNestedText(parent, childSelector, keySelector) {
		var items = parent.children(childSelector).sort(function(a, b) {
			var vA = jQuery(keySelector, a).text();
			var vB = jQuery(keySelector, b).text();
			console.log('vA'+vA+' '+'vB'+vB);
			console.log(keySelector);
			return (vA < vB) ? -1 : (vA > vB) ? 1 : 0;
		});
		parent.append(items);
	}
		child1 = "div.layered-navigation,.option-block";
		child2 = "div span.filter-title"
		sortUsingNestedText(jQuery('dl.filter-block'), child1, child2);
})
[HTML] pobierz, plaintext