jQuery 检查一个 ul 是否包含另一个 ul 的元素

jQuery check if one ul contains elements from another

我有两个列表

我想要做的是从第一个列表中获取每个元素的文本,如果文本与第二个列表中的元素值相匹配,而不是在 select 选项第二个列表中对其进行着色。

这是两个列表:

榜单第 1

<div id="rssedituserdata">
<li>1444</li>
<li>1445</li>
</div>

榜单第 2

<div class="form-item form-item-labeled" id="edit-field-building-no-value-wrapper">
<select name="field_building_no[value][]" multiple="multiple" class="form-select" id="edit-field-building-no-value">
    <option value="1444">a</option>
    <option value="1445">b</option>
    <option value="1446">c</option>
    <option value="1447">d</option>
    <option value="1448">e</option>
    <option value="1449">f</option>
    <option value="1450">g</option>
</select>
</div>

这就是我到目前为止所做的....

        $("#edit-field-building-no-value-wrapper option").each(function() {
        var building = $(this).text();
        console.log(building);


        $("#rssedituserdata>li").each(function(building) {
            if ($(this).has(building)) {
                building.css('color', 'red');
            }
        });
    });

使用属性 select 或 select 值属性等于列表项文本的选项:

    $("#rssedituserdata>li").each(function(i,v) {
       $('option[value="'+$(v).text()+'"]').css('color', 'red');
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="rssedituserdata">
<li>1444</li>
<li>1445</li>
</div>


<div class="form-item form-item-labeled" id="edit-field-building-no-value-wrapper">
<select name="field_building_no[value][]" multiple="multiple" class="form-select" id="edit-field-building-no-value">
    <option value="1444">a</option>
    <option value="1445">b</option>
    <option value="1446">c</option>
    <option value="1447">d</option>
    <option value="1448">e</option>
    <option value="1449">f</option>
    <option value="1450">g</option>
</select>
</div>

要删除不在列表中的元素,请执行以下操作:将 class 添加到列表中的元素并删除所有没有 class 的选项

$("#rssedituserdata>li").each(function(i,v) {
       $('option[value="'+$(v).text()+'"]').addClass('dont-remove').css('color', 'red');
    });
$('option:not(.dont-remove)').remove();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="rssedituserdata">
<li>1444</li>
<li>1445</li>
</div>


<div class="form-item form-item-labeled" id="edit-field-building-no-value-wrapper">
<select name="field_building_no[value][]" multiple="multiple" class="form-select" id="edit-field-building-no-value">
    <option value="1444">a</option>
    <option value="1445">b</option>
    <option value="1446">c</option>
    <option value="1447">d</option>
    <option value="1448">e</option>
    <option value="1449">f</option>
    <option value="1450">g</option>
</select>
</div>