JQuery скрыть родительский ul

У меня есть следующий div, который содержит список выбора тегов (категорий), которые при выборе фильтруют (скрывают) любые li, содержащие выбранное слово. Это работает хорошо, однако мне бы хотелось, чтобы родительский объект был скрыт.

Например, если была выбрана неврология, я бы хотел, чтобы заголовок 2 и его родительский ul все еще были видны вместе с неврологией. Если выбран диабет, я бы хотел, чтобы родительский ul был полностью скрыт.

Может кто-нибудь помочь с этим?

HTML

<div id = "container">
    <select id = "tags">
       <option>Cancer</option>
       <option>Diabetes</option>
       <option>Obesity</option>
    </select>

    <ul class = "itemdetails">
       <li class = "heading">Heading 1</li>
       <li><a href><span class = "tagdetails">Diabetes</span></a></li>
    </ul>
    <ul class = "itemdetails">
       <li class = "heading">Heading 2</li>
       <li><a href><span class = "tagdetails">Obesity</span></a></li>
       <li><a href><span class = "tagdetails">Neurology</span></a></li>
    </ul>
</div>

Jquery

var itemlist = $('#container');
$('#tags').change( function () {
    var tagsfilter = $(this).val();
    if (tagsfilter) {
        $matches = $(itemlist).find('span.tagdetails:Contains(' + tagsfilter + ')').parent();
         $('a', itemlist).not($matches).hide();
        $matches.show();
    } else {
        $(itemlist).find("a").show();
    }
    return false;
})