JQuery搜索按特定类筛选

Question

所以，我正在做一个数据库选择并带来像这样的div中的表的所有字段：

<div class="card hoverable reserva">
    <div class="card-content">
        <div class="cod-reserva-lbl teal-text text-lighten-2">Reservation number.</div>
        <div class="reservation-code teal-text">00000000</div>
        <div class="reservation-item">
            <b>Car's licence plate:</b> <span class="dato">AAA-000</span>
        </div>
        <div class="reservation-item">
            <b>Person's ID:</b> <span class="dato">00000000</span>
        </div>
        <div class="reservation-item">
            <b>Departure:</b> <span class="dato">dd/mm/yyyy</span>
        </div>
        <div class="reserva-item">
            <b>Arrival:</b> <span class="dato">dd/mm/yyyy</span>
        </div>
        <div class="reservation-item">
            <b>Starting city:</b> <span class="dato">Some city</span>
        </div>
        <div class="reservation-item">
            <b>Destination city:</b> <span class="dato">Some other city</span>
        </div>
        <div class="reservation-item">
            <b>Price:</b> <span class="green-text dato">$XXXXXX</span>
        </div>
    </div>
    <div class="card-action card-action-reservation">
        <a href="#" class="green-text flat-small waves-effect waves-green">
            <i class="left material-icons">mode_edit</i> Edit
        </a>
        <a href="#" class="red-text flat-small waves-effect waves-red">
            <i class="left material-icons">delete</i> Delete
        </a>
    </div>
</div>

我目前使用的脚本是这样的：

//Search filter
var $rows = $('.reservation');

//#search is the input I'm using as search bar
$('#search').keyup(function () {

    var val = '^(?=.*\\b' + $.trim($(this).val()).split(/\s+/).join('\\b)(?=.*\\b') + ').*$',
            reg = RegExp(val, 'i'),
            text;

    $rows.show().filter(function () {
        text = $(this).text().replace(/\s+/g, ' ');
        return !reg.test(text);
    }).hide();
});

问题是，如果我搜索“预订号码”，它仍会显示所有这些，因为它们都包含“预订号码”。我想要的是能够为span.dato项目内的文本过滤完全。我怎样才能做到这一点？