iDrugov

В общем, самая "нативная" сортировка (не без участия jQuery) у меня получилась следующим образом:
Все данные в ячейках я вношу в data-attribute, которые легализованы в HTML5. Чтобы метод sort() работал так, как мне надо -- данные привожу в к нижнему регистру и заменяю кавычки на апострофы, чтобы не возникла конфликта на уровне HTML.

об этом тоже есть порно вопрос
< td data-val="данные 'с кавычками' из ячейки">Данные "с кавычками" из ячейки< /td>

1. Клик по th возвращает мне номер столбца
2. Собираю из td с этим индексом значения в data-val
3. Использую .sort() и .sort().reverse() для создания сортировки по возрастанию и убыванию.

Далее в ход идёт jQuery с чудесным методом detach(), который "вырезает" элемент со страницы, не удаляя данных о нём. И затем этот элемент я вставляю после первой строки, тем самым сортируя табличные данные: $($(sortElem).detach()).insertAfter('table tr:first-child');, где sortElem = $('[data-val="'+массив с данным+'"]').parent()[0]; -- parent возвращает мне весь tr

Ну и всё это, конечно с циклами, чтобы проходиться по массивам.

Получилось, в принципе, достаточно коротко, работает шустро, сортирует относительно правильно. Единственная проблема -- числа сортируются 1, 10, 11, ... 2, 20, 21 и т.д. Но это немного позже прогуглю, как исправить, т.к. в рамках моего проекта пока не очень критично.

В общем, мои проблемы решила примерно такая конструкция, которая в данном примере находит всё, что находится между треугольными скобками и заменяет там только нужное слово на новое значение

someElem.replace(/<.+?>/g, function(str){
return str.replace(/gray/g, '<b class=gray>')
});

Блин, нашёл, где косяк: надо было заменить нижнее подчёркивание на пробел, тогда текст почему-то остаётся в UTF-8 и метод срабатывает. Вот такое "очевидное" решение.

В конечном виде получилась регулярка:

decodeURIComponent($(this)[0].href.match(/p=(.+)/)[1].replace(/_/g, ' '));

Надо добавить или заменить?

$('.open').addClass('close'); // добавляет
$('.open').addClass('close').removeClass('open'); // заменяет
$('.open').toggleClass('close'); // переключает класс close - добавляет его и удаляет при наличии

$('#audio-play').removeClass('open').addClass('close'); // заменяет

Ну и в вопросе в начале идёт обращение по #, а поставлено по классу .

Написал свой, на jQ, а то все предлагают с ajax и прочей чёрной магией.

Как выяснилось в процессе работы - datalist не поддерживается Safari, в том числе на iPhone и IE на WindowPhone. Потому кроссбразуерное решение пришлось искать там, от чего уходил. Очень грустная поддержка HTML5.

https://jsfiddle.net/8f53otky/26/