title: How autocomplete with javascript via api call
body: <p>i'm trying to make auto complete with pure javascript.
  Scenario is when type to input some letters it will search movies from omdbapi. </p>
  
  <p>I make it like that: </p>
  
  <p>i have input which users can search movies, i have get data from input value:</p>
  
  <pre><code>&lt;input type="text" class="form-control" id="searchMovie" value=""&gt;
  </code></pre>
  
  <p>and here i get movies and make html markup with javascript for show these results in html: </p>
  
  <pre><code>var searchInput = document.getElementById("searchMovie");
  
      // get movie
      searchInput.onkeydown = function() {
      var searchData = document.getElementById("searchMovie").value;
  
      if (searchData.length &gt;= 3 ) {
          var request = new XMLHttpRequest();
          request.open('GET', 'http://www.omdbapi.com/?s=' + searchData + '&amp;apikey=000000', true);
          request.onload = function () {
              // Begin accessing JSON data here
              var data = JSON.parse(this.response);
  
              const wrapper = document.createElement('div');
              app.appendChild(wrapper);
              var results = data;
              if (request.status &gt;= 200 &amp;&amp; request.status &lt; 400) {
                  console.log(data);
                  Object.keys(data.Search).map(function(key, index) {
                      console.log(data.Search[index].Title);
  
                      const searchResultsContainer = document.createElement('div');
                      searchResultsContainer.setAttribute('class', 'row');
  
                      const h1 = document.createElement('h1');
                      h1.textContent = data.Search[index].Title;
                      wrapper.appendChild(searchResultsContainer);
                      searchResultsContainer.appendChild(h1);
                      console.log(searchResultsContainer);
                   });
              } else {
                  console.log('error');
              }
          };
          request.send();
      }
    };
  </code></pre>
  
  <p>everything work well but problem is: </p>
  
  <p>when i try to delete keyword which i wrote and write new one results not disappear from html, i want change </p>