JSFiddle - React, Tailwind, and code Playground
HTML
<div class="searchContend_h">
<div class="ui-grid-c" >
<div class="ui-block-a">
<input name="text-12" id="text-12" value="" type="text" class="textSearchvalue_h">
</div>
<div class="ui-block-b">
<a href="#" data-role="button" data-corners="false" data-inline="true" class="searchButtonClickText_h" >Search</a>
</div>
<div class="ui-block-c">
<a href="#" data-role="button" data-corners="false" data-inline="true" class="next_h" id="next">Next</a>
</div>
<div class="ui-block-d">
<a href="#" data-role="button" data-corners="false" data-inline="true" class="previous_h" id="prev">Previous</a>
</div>
</div>
</div>
<div data-role="content" data-theme="d">
<div id="realTimeContents" class="realtimeContend_h">
hsddhjdshssjsdsdjksdldskjsdkjdksjfksdjfklsdjflsdjfsdjflksdjksdjfjklsdfjljlskdfjklsdjkljkdsjkjkljkljkljkjjljlkjkljkljkjkljlkjlkjj nasbsdhsd msdmsdm sdjaidj kkdsdj
hsddhjdshssjsdsdjksdldskjsdkjdksjfksdjfklsdjflsdjfsdjflksdjksdjfjklsdfjljlskdfjklsdjkljkdsjkjkljkljkljkjjljlkjkljkljkjkljlkjlkjj nasbsdhsd msdmsdm sdjaidj kkdsdj
hsddhjdshssjsdsdjksdldskjsdkjdksjfksdjfklsdjflsdjfsdjflksdjksdjfjklsdfjljlskdfjklsdjkljkdsjkjkljkljkljkjjljlkjkljkljkjkljlkjlkjj nasbsdhsd msdmsdm sdjaidj kkdsdj
hsddhjdshssjsdsdjksdldskjsdkjdksjfksdjfklsdjflsdjfsdjflksdjksdjfjklsdfjljlskdfjklsdjkljkdsjkjkljkljkljkjjljlkjkljkljkjkljlkjlkjj nasbsdhsd msdmsdm sdjaidj kkdsdj
hsddhjdshssjsdsdjksdldskjsdkjdksjfksdjfklsdjflsdjfsdjflksdjksdjfjklsdfjljlskdfjklsdjkljkdsjkjkljkljkljkjjljlkjkljkljkjkljlkjlkjj nasbsdhsd msdmsdm sdjaidj kkdsdj
hsddhjdshssjsdsdjksdldskjsdkjdksjfksdjfklsdjflsdjfsdjflksdjksdjfjklsdfjljlskdfjklsdjkljkdsjkjkljkljkljkjjljlkjkljkljkjkljlkjlkjj nasbsdhsd msdmsdm sdjaidj kkdsdj
...
JavaScript
var searcher = $("#realTimeContents").search({
searchType: "highlightSelected",
searchSelector : "div",
scrollTo : true
});
//make sure we find the same text, otherwise clear search postions
function find(up) {
var currentText = searcher.getText();
var text = $(".textSearchvalue_h").val();
alert(text);
if (text != currentText) {
searcher.setText(text);
//alert(getConcurrencesNumber());
}
searcher.nextConcurrence(up);
}
//bind events
$("#prev").click(function(e) {
alert("pre")
e.preventDefault();
find(true);
});
$("#next").click(function(e) {
alert("next")
e.preventDefault();
find(false);
});
$("#search").click(function(e) {
e.preventDefault();
find(true);
});