How to use typeahead in multiple fields at once?

Question

Hi, I was wondering how I might be using the typeahead in various inputs.

I’m using Bootstrap and with it I made a row with some inputs, in the first input I am using typeahead to search for words, there is possibility to clone this row thus making new entries.

The problem is, the typeahead only works in the first input, in the others it does not work.

---

<input type="text" name="palavras" class="form-control typeahead" data-provide="typeahead">

var substringMatcher = function (strs) {
   return function findMatches(q, cb) {
      var matches, substrRegex;
      matches = [];
      substrRegex = new RegExp(q, 'i');
      $.each(strs, function (i, str) {
         if (substrRegex.test(str)) {
            matches.push(str);
         }
      });
      cb(matches);
   };
};

var palavras= ['olá', 'tudo bem', 'sol', 'praia','neve'];

$('.typeahead').typeahead({
   hint: true,
   highlight: true,
   minLength: 1
},{
  name: 'palavras',
  source: substringMatcher(palavras)
});

I hope to open a legal discussion on this subject.