JQuery Filter list by child

Question

Я довольно новичок в JQuery ' Я пытаюсь отфильтровать упорядоченный список, используя дочерний класс вместо содержимого списка. В этом случае мне нужно фильтровать класс «title» вместо полного содержимого «li». Можно ли это сделать с помощью js? Спасибо.

<ol data-filter="true"> 
    <li> 
    <div class="title">Andy</> 
    Age:9 
    Class:5 
    Hobby: Sketching 
    Food: Chicken 
    Allergies: NONE 
    </li> 
    <li>...</li> 
</ol> 

Answer 1

Для HTML, например:

<ol> 
    <li> 
     <div class="title">Andy</div> 
     Age:9 
     Class:5 
     Hobby: Sketching 
     Food: Chicken 
     Allergies: NONE 
    </li> 
    <li> 
     <div class="title">Paul</div> 
     Age:10 
     Class:3 
     Hobby: Sky Diving 
     Food: Oranges 
     Allergies: Dairy 
    </li> 
</ol> 

можно использовать JQuery ниже, чтобы выбрать Энди:

$(document).ready(function() { 
    var selectedListItem = $('#myList .title:contains("Andy")').parents("li"); 
    selectedListItem.hide(); 
}); 

Пример на jsFiddle: http://jsfiddle.net/xgPYx/

Answer 2

Вы должны быть в состоянии петля через элементы li и либо удалить, либо скрыть их.

function filterByTitle(listID, title) { 
    $("#" + listID + " li").each(function() { 
     if ($(this).find(".title").html() != title) 
      $(this).remove(); //can use .hide() instead of .remove if desired 
    }); 
} 

Смотрите jsFiddle здесь: http://jsfiddle.net/7KW66/