[desertFox]

Добрый вечер.

Допустим, есть поле ввода и список из марок машин, html:

<input type="text" maxlength="30" placeholder="Поиск..." id="search" />

<ul id="cars">
  <li><a href="#"><span class="brand">Alfa Romeo</span></a></li>
  <li><a href="#"><span class="brand">AC</span></a></li>
  <li><a href="#"><span class="brand">Alpina</span></a></li>
  <li><a href="#"><span class="brand">Bertone</span></a></li>
  <li><a href="#"><span class="brand">Briliance</span></a></li>
  <li><a href="#"><span class="brand">Baltijas Dzips</span></a></li>
  <li><a href="#"><span class="brand">Cadillac</span></a></li>
  ... и т.д. ...
</ul>

При наборе текста список машин должен меняться на список, названия которых совпадают с текстом в поле ввода. Если введена буква "а" - остаются только машины начинающие на "а", если добавляется вторая буква снова сортировка списка на совпадения из двух букв, и так далее.

Новый список создаётся из списка, который ниже под полем ввода, т.е. никаких аякс-запросов ненужно, на странице список уже есть.

Начал это дело реализовывать, но пока закончить не получается, js:

$(document).ready(function () {

  var cars_clone = $('#cars li').clone();
  var cars_box = $('#cars');
  var cars_list = $('#cars span.brand');
  
  $('#search').keyup(function(){

	var search = $('#search').val();
	
	if(search.length) {

        // а тут не знаю как быть))

	} else {
      cars_box.html(cars_clone);
    }

  });
});