JSFiddle - React, Tailwind, and code Playground

by niklasvh

HTML

<ul id="mylist">
    <li data-label="red" data-size="1">Item 1</li>
    <li data-label="orange" data-size="3">Item 2</li>
    <li data-label="red" data-size="2">Item 3</li>
    <li data-label="yellow" data-size="2">Item 4</li>
    <li data-label="red" data-size="1">Item 5</li>
</ul>
<br />
<a id="find" href="#">Find matching elements</a>
<br /><br />
<ul id="showresults"></ul>

CSS

ul,li {
    list-style: none;
}

JavaScript

$(document).ready(function() {
    $('#find').click(function() {
      $('#showresults').html($('li[data-label="red"][data-size="1"]'));
        
        return false;
    });
});