Html 用CSS隐藏数据值

我有以下表格：

<ul id="ui-id-1">
<li class="ui-menu-item wil-search-suggestion-item" data-value="Accommodation"><div class="ui-menu-item-wrapper"><div class="label-and-info">Accommodation</div></div></li>
<li class="ui-menu-item wil-search-suggestion-item" data-value="Activities"><div class="ui-menu-item-wrapper"><div class="label-and-info">Activities</div></div></li>
<li class="ui-menu-item wil-search-suggestion-item" data-value="Bars"><div class="ui-menu-item-wrapper"><div class="label-and-info">Bars</div></div></li>
<li class="ui-menu-item wil-search-suggestion-item" data-value="Day Clubs"><div class="ui-menu-item-wrapper"><div class="label-and-info">Day Clubs</div></div></li>
<li class="ui-menu-item wil-search-suggestion-item" data-value="Events"><div class="ui-menu-item-wrapper"><div class="label-and-info">Events</div></div></li>
</ul>

住宿
活动
栏
日俱乐部
事件

我希望能够从中隐藏事件列表。这是我无法编辑的Wordpress主题

有没有一种CSS黑客我可以使用？

怎么样

ul li:last-child {
    visibility: hidden;
}

这将获取未排序列表中列表的最后一个子项，并将其隐藏。（因为“事件”是列表中的最后一个）