aledavydkin,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script type="text/javascript">
function filter2(phrase, _id) {
var words = phrase.value;
var show = [].filter.call(document.querySelectorAll("#" + _id + " tbody tr"), function(tr) {
var text = tr.cells[1].textContent;
tr.style.display = text.indexOf(words) == 0 ? "" : "none";
return text.indexOf(words) == 0
});
if (!show.length)[].forEach.call(document.querySelectorAll("#" + _id + " tbody tr"), function(tr) {
tr.style.display = ""
})
}; </script>
</head>
<body>
<div class="">Фильтрация строк таблицы</div> <input name="filt" onkeyup="filter2(this, 'product-feature')" style="width:350px;" type="text" />
<table class="table" id="product-feature" >
<thead>
<tr><th data-type="number">ID</th><th> Города</th></tr>
</thead>
<tbody>
<tr><td>1</td><td>Миша</td></tr>
<tr><td>2</td><td>Саня</td></tr>
<tr><td>3</td><td>Машина</td></tr>
<tr><td>4</td><td>Самолет</td></tr>
<tr><td>5</td><td>Обруч</td></tr>
</tbody>
</table>
</body>
</html>