JSFiddle - React, Tailwind, and code Playground
HTML
<section id="content">
<div id="search-block">
<input type="text" id="inpSearch" placeholder="Search.." />
</div>
<div>
<div class="wrapper">
<h1>Question 1</h1>
<p>Harry Markus Upload</p>
</div>
</div>
<div>
<div class="wrapper">
<h1>Question 2</h1>
<p>Registration Append August Download</p>
</div>
</div>
<div>
<div class="wrapper">
<h1>Question 3</h1>
<p>Login July Dad</p>
</div>
</div>
</section>
JavaScript
jQuery.expr[':'].Contains = function(a, i, m) {
return jQuery(a).text().toUpperCase()
.indexOf(m[3].toUpperCase()) >= 0;
};
jQuery.expr[':'].contains = function(a, i, m) {
return jQuery(a).text().toUpperCase()
.indexOf(m[3].toUpperCase()) >= 0;
};
$('#inpSearch').keyup(function(){
var sSearch = this.value;
sSearch = sSearch.split(" ");
$('section#content > div:not(:first-child)').hide();
$.each(sSearch, function(i){
$('section#content > div:contains("' + sSearch[i] + '"):not(:first-child)').show();
});
});