JSFiddle - React, Tailwind, and code Playground

by Bahman ParsaManesh

HTML

<!DOCTYPE html>
<html>
<body>

<p id="text"></p>
<button id="search">Find!</button>

<p id="numOfResults"></p>
<div id="listOfResults"></div>

</body>
</html>

JavaScript

var mystr = "I learned to play the Ukulele in Lebanon.";
/* document.getElementById("text").innerHTML = str; */
var str = mystr.toLowerCase();
document.getElementById("text").innerHTML = str;
var e = document.getElementById('search'); 
e.onclick = search;

function search() {
	var stack = [];
  var m;
  var searchWord = "le";
  var searchWordLength = searchWord.length;
  var newm = 0;
  var f = 0;
  var list;
  var numberOfKeyWords = str.split(searchWord).length-1;
      
  for (var i=0; i<numberOfKeyWords; i++) {
  	m = str.search(searchWord);
       
    str = str.substr(m+searchWordLength+1,str.length);
    newm = newm + m ;
    f = (newm + ( searchWordLength+1)*i );
        
    stack.push(f);
        
  }

  document.getElementById("numOfResults").innerHTML = "I Could Find " + stack.length + " Result(s) in :";
  list = "<ul id='listOfResults'>";

  for (var j=0; j<stack.length; j++) {
    list += "<li>"+stack[j]+"</li>";
  }

  list += "</ul>";

  document.getElementById("listOfResults").innerHTML = list;

}