title: Javascript can't run twice
body: <p><a href="http://link-tags.com/adgen/index.html" rel="nofollow">You can see the app there</a></p>
  
  <p>I have i piece of javascript function generating data.
  I use var in inputs, then i parse them.
  When i hit the "generate button" all is ok, my textarea is populated with my data and vars are parsed.
  Then, if i choose to delete data inside the result textarea, changing my vars in my inputs to create a different variation of report and i hit again the generate button , nothing happend...</p>
  
  <p>Try to add data, generate report, delete data into the result textarea, then regenerate a report... (sources are in clear on website (JS, HTML)</p>
  
  <p><a href="http://link-tags.com/adgen/index.html" rel="nofollow">You can see the app there</a></p>
  
  <p>Thanks a lot for your helps :)</p>
  
  <p>JS CODE : </p>
  
  <pre><code>    /**
   * Parse a template with data
   * 
   * @param {String} tpl
   * @param {Object} data
   * @returns {String}
   */
  var parseStr = function (tpl, data) {
      return tpl.replace(/\{\{([\w\.]*)\}\}/g, function (str, key) {
          var keys = key.split('.');
          var v = data[keys.shift()];
          var l = keys.length;
          for (var i = 0; i &lt; l; i++) {
              v = v[keys[i]];
          }
          return typeof v !== 'undefined' &amp;&amp; v !== null ? v : '';
      });
  };
  
  /**
   * Array to csv string
   * 
   * @param {Array} ary
   * @returns {String}
   */
  var ary2csv = function (ary) {
      var l = ary.length;
      for (var i = 0; i &lt; l; i++) {
          ary[i] = ary[i].replace(/"/g, '""');
      }
      return '"' + ary.join('","') + '"' + "\n"
  };
  
  /**
   * Add new variable
   */
  $('#addVar').on('click', function () {
      var nRows = $('#vars &gt; .row').length;
      var $new = $('#templates .row').clone();
      $new.find('label').attr('for', 'VAR' + nRows).text('{{' + 'VAR' + nRows + '}}');
      $new.find('input').attr('id', 'VAR' + nRows);
      $new.appendTo('#vars');
  });
  
  $(document).on('keyup', '.var', function () {
      var len = $(this).val().length;
      var $row = $(this).closest('.row');
      $row.find('.col-xs-4').text('' + len);
      if (len &gt; 35) {
          $row.css('color', 'red');
      }
      else {
          $row.css('color', '');
      }
  });
  
  /**
   * Add new group
   */
  $('#addGroup').on('click', function () {
      var $new = $('#groups .group:first').clone();
      $new.find('input').val('');
      $new.appendTo('#groups');
  });
  
  /**
   * Build the report
   */
  $('#make').on('click', function () {
  
  // Variables dynamiques
      var zones = {};
      var nRows = null;
      var isValid = true;
      $('#zones textarea').each(function () {
          var ary = $(this).val().split("\n");
          zones[$(this).attr('id')] = ary;
          if (nRows === null) {
              nRows = ary.length;
          }
          else if (ary.length !== nRows) {
              isValid = false;
              return;
          }
      });
      if (!isValid) {
         alert('Chaque zone de texte doit contenir le même nombre de lignes (vides ou non vides).');
  
  
          return;
      }
  
  // Variables fixes
      var data = {};
      $('#vars input').each(function () {
          data[$(this).attr('id')] = $.trim($(this).val());
      });
      // Clear report
      $('#report').empty();
      // Columns name
      var titles = [];
      $('#groups .group:first label').each(function () {
          titles.push($(this).text());
      });
      $('#report').append(ary2csv(titles));
      // On boucle sur le nombre de ligne dans les zones
      for (var i = 0; i &lt; nRows; i++) {
  
  // On ajoute a data chaque zone pour la ligne i
          for (var j in zones) {
              data[j] = zones[j][i];
          }
  
  // On parse chaque texte
          $('#groups .group').each(function () {
              var cols = [];
              $(this).find('input').each(function () {
                  cols.push(parseStr($(this).val(), data));
              });
              $('#report').append(ary2csv(cols));
          });
      }
  });
  </code></pre>
  
  <p>HTML : </p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;!--[if lt IE 7 ]&gt;&lt;html lang="en" class="no-js ie6"&gt; &lt;![endif]--&gt;
  &lt;!--[if IE 7 ]&gt;&lt;html lang="en" class="no-js ie7"&gt; &lt;![endif]--&gt;
  &lt;!--[if IE 8 ]&gt;&lt;html lang="en" class="no-js ie8"&gt; &lt;![endif]--&gt;
  &lt;!--[if IE 9 ]&gt;&lt;html lang="en" class="no-js ie9"&gt; &lt;![endif]--&gt;
  &lt;!--[if (gt IE 9)|!(IE)]&gt;&lt;!--&gt;&lt;html lang="fr" class="no-js"&gt; &lt;!--&lt;![endif]--&gt;
      &lt;head&gt;
          &lt;meta charset="utf-8"&gt;
          &lt;meta name="author" content="Cédric Duma"&gt;
          &lt;meta name="viewport" content="width=device-width,initial-scale=1"&gt;
          &lt;title&gt;Mass AdText Generator&lt;/title&gt;
  
          &lt;!-- main JS libs --&gt;
          &lt;script src="assets/js/libs/modernizr.min.js"&gt;&lt;/script&gt;
          &lt;script src="assets/js/libs/jquery-1.10.2.min.js"&gt;&lt;/script&gt;
          &lt;script src="assets/js/libs/jquery-ui.min.js"&gt;&lt;/script&gt;
          &lt;script src="assets/js/libs/bootstrap.min.js"&gt;&lt;/script&gt;
  
          &lt;!-- Style CSS --&gt;
          &lt;link href="assets/css/bootstrap.css" media="screen" rel="stylesheet"&gt;
          &lt;link href="assets/css/style.css" media="screen" rel="stylesheet"&gt;
          &lt;link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet"&gt;
  
          &lt;!-- General Scripts --&gt;
          &lt;script src="assets/js/general.js"&gt;&lt;/script&gt;
  
          &lt;!--[if lt IE 9]&gt;&lt;script src="js/respond.min.js"&gt;&lt;/script&gt;&lt;![endif]--&gt;
          &lt;!--[if gte IE 9]&gt;
          &lt;style type="text/css"&gt;
              .gradient {filter: none !important;}
          &lt;/style&gt;
          &lt;![endif]--&gt;
          &lt;link href="assets/css/video-js.css" rel="stylesheet"&gt;
          &lt;script src="assets/js/video.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
  
      &lt;body class="body-wrap"&gt;
          &lt;!--container--&gt;
          &lt;div class="container"&gt;
              &lt;div class="row"&gt;
                  &lt;div class="col-md-8"&gt;
                      &lt;div class="page-header"&gt;
                          &lt;h1&gt;Générateur en masse de textes d'annonce&lt;/h1&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="col-md-4"&gt;
                      &lt;img src="assets/images/baseline.png" alt="Mass AdText Generator" class="img-responsive"&gt;
  
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;br/&gt;
          &lt;section&gt;
              &lt;div class="container"&gt;
                  &lt;div class="row"&gt;
                      &lt;div class="col-md-12"&gt;
  
                          &lt;div class="container"&gt;
                              &lt;div class="row"&gt;
                                  &lt;div class="col-md-5"&gt;
                                      &lt;p class="text-justify"&gt;Vous avez la charge de &lt;b&gt;créer des annonces pour vos campagnes AdWords&lt;/b&gt;, et cette tâche peut vite devenir &lt;b&gt;très cronophage&lt;/b&gt;. Lorsque vous cumulez un important nombre de campagnes et/ou de groupes d'annonces et que vous souhaitez écrire 3 annonces à chaque fois, vous vous embarquez pour quelques heures de travail.&lt;br/&gt;
                                          &lt;br/&gt;&lt;b&gt;Créez automatiquement des centaines d'annonces&lt;/b&gt; rapidement et cela en quelques clics grâce à cette application simple d'utilisation ! Il vous suffit de préparer en amont quelques informations pour remplir les différentes zones de textes.&lt;br/&gt;&lt;br/&gt;Remplacez ensuite le contenu des variantes de textes d'annonces avec vos variables, cliquer sur le bouton "Générer le rapport" et voila ! Il ne vous reste plus qu'à utiliser Excel pour convertir ces données au format CSV pour les intégrer dans AdWords Editor par exemple.&lt;/p&gt;
                                  &lt;/div&gt;
                                  &lt;div class="col-md-6 pull-right"&gt;
                                      &lt;!-- &lt;iframe width="560" height="315" src="https://www.youtube.com/embed/M7lc1UVf-VE" frameborder="0" allowfullscreen&gt;&lt;/iframe&gt;--&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
  
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/section&gt;
          &lt;br/&gt;
          &lt;section&gt;
              &lt;div class="container"&gt;
                  &lt;div class="row"&gt;
                      &lt;div class="col-md-12"&gt;
                          &lt;h2&gt;Première étape : Listez vos groupes d'annonces ainsi que les textes spécifiques.&lt;/h2&gt;
                          &lt;small&gt;Définissez vos noms de groupes d'annonces, Lignes de description, Url finale ou tout autre texte spécifique.&lt;/small&gt;
  
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/section&gt;
          &lt;br/&gt;
          &lt;section&gt;
              &lt;div class='container'&gt;
                  &lt;p class="alert alert-warning"&gt;Il est important que chaque zone de texte comporte le même nombre de lignes pour que la génération soit possible.
                      &lt;br/&gt;Il est possible d'insérer &lt;b&gt;des lignes vides&lt;/b&gt;&lt;/p&gt;
                  &lt;br/&gt;
              &lt;/div&gt;
          &lt;/section&gt;
          &lt;div class="container"&gt;
              &lt;section id="zones" class="row"&gt;
                  &lt;div class="col-xs-3 text-center"&gt;
                      &lt;label for="AG"&gt;Groupe d'annonce&lt;/label&gt;
                      &lt;br/&gt;&lt;small&gt;Variable {{AG}} &lt;/small&gt;
                      &lt;br /&gt;
                      &lt;textarea id="AG"&gt;&lt;/textarea&gt;
                  &lt;/div&gt;
                  &lt;div class="col-xs-2 text-center"&gt;
                      &lt;label for="D1"&gt;Texte alternatif 1&lt;/label&gt;
                      &lt;br/&gt;&lt;small&gt;Variable {{D1}} &lt;/small&gt;
                      &lt;br /&gt;
                      &lt;textarea id="D1"&gt;&lt;/textarea&gt;
                  &lt;/div&gt;
                  &lt;div class="col-xs-2 text-center"&gt;
                      &lt;label for="D2"&gt;Texte alternatif 2&lt;/label&gt;
                      &lt;br/&gt;&lt;small&gt;Variable {{D2}} &lt;/small&gt;
                      &lt;br /&gt;
                      &lt;textarea id="D2"&gt;&lt;/textarea&gt;
                  &lt;/div&gt;
                  &lt;div class="col-xs-2 text-center"&gt;
                      &lt;label for="URLDIS"&gt;Url Display&lt;/label&gt;
                      &lt;br/&gt;&lt;small&gt;Variable {{URLDIS}} &lt;/small&gt;
                      &lt;br /&gt;
                      &lt;textarea id="URLDIS"&gt;&lt;/textarea&gt;
  
                  &lt;/div&gt;
                  &lt;div class="col-xs-3 text-center"&gt;
                      &lt;label for="URLDES"&gt;Url de Destination&lt;/label&gt;
                      &lt;br/&gt;&lt;small&gt;Variable {{URLDES}} &lt;/small&gt;
                      &lt;br /&gt;
                      &lt;textarea id="URLDES"&gt;&lt;/textarea&gt;
  
                  &lt;/div&gt;
              &lt;/section&gt;
  
              &lt;hr /&gt;
              &lt;section&gt;
                  &lt;div class="container"&gt;
                      &lt;div class="row"&gt;
                          &lt;div class="col-md-12"&gt;
                              &lt;h2&gt;Seconde étape : Ajoutez vos propres variables&lt;/h2&gt;
                              &lt;small&gt;Rajoutez vos textes personnalisés et utilisez les variables &lt;b&gt;{{VAR0}}&lt;/b&gt;,&lt;b&gt;{{VAR1}}&lt;/b&gt;, etc. pour les insérer dans les variation de vos textes d'annonce. &lt;/small&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/section&gt;
              &lt;br/&gt;
              &lt;section id="vars"&gt;
                  &lt;a id="addVar"&gt;&lt;span class="glyphicon glyphicon-plus-sign green" aria-hidden="true"&gt;&lt;/span&gt; Ajouter une variable&lt;/a&gt;
                  &lt;div class="row"&gt;
                      &lt;form class="navbar-form"&gt;
                          &lt;div class="col-xs-3"&gt;
                              &lt;label for="VAR0"&gt;{{VAR0}}&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="col-xs-5"&gt;
                              &lt;input type="text" id="VAR0" class="var" style="width: 350px;"/&gt;
                          &lt;/div&gt;
                          &lt;div class="col-xs-4"&gt;
                              0
                          &lt;/div&gt;
                      &lt;/form&gt;
                  &lt;/div&gt;
                  &lt;div class="row"&gt;
                      &lt;form class="navbar-form"&gt;
                          &lt;div class="col-xs-3"&gt;
                              &lt;label for="VAR1"&gt;{{VAR1}}&lt;/label&gt;
                          &lt;/div&gt;
                          &lt;div class="col-xs-5"&gt;
                              &lt;input type="text" id="VAR1" class="var" style="width: 350px;"/&gt;
                          &lt;/div&gt;
                          &lt;div class="col-xs-4"&gt;
                              0
                          &lt;/div&gt;
                      &lt;/form&gt;
                  &lt;/div&gt;
              &lt;/section&gt;
  
              &lt;hr /&gt;
              &lt;section&gt;
                  &lt;div class="container"&gt;
                      &lt;div class="row"&gt;
                          &lt;div class="col-md-12"&gt;
                              &lt;h2&gt;Troisième étape : Créez vos modèles de textes d'annonce&lt;/h2&gt;
                              &lt;small&gt;Utilisez du texte ou une variable disponible pour construire chacune des variations d'un texte d'annonce.&lt;/small&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/section&gt;
              &lt;br/&gt;
              &lt;section id="groups"&gt;
                  &lt;a id="addGroup"&gt;&lt;span class="glyphicon glyphicon-plus-sign green" aria-hidden="true"&gt;&lt;/span&gt; Ajouter une variation d'annonce&lt;/a&gt;
                  &lt;br/&gt;
                  &lt;section class="group"&gt;
                      &lt;div class="row"&gt;
                          &lt;form class="navbar-form"&gt;
                              &lt;div class="col-xs-3"&gt;
                                  &lt;label for="titre"&gt;Titre&lt;/label&gt;
                              &lt;/div&gt;
                              &lt;div class="col-xs-5"&gt;
                                  &lt;input type="text"/&gt;
                              &lt;/div&gt;
                          &lt;/form&gt;
                      &lt;/div&gt;
                      &lt;div class="row"&gt;
                          &lt;form class="navbar-form"&gt;
                              &lt;div class="col-xs-3"&gt;
                                  &lt;label for="desc1"&gt;Description 1&lt;/label&gt;
                              &lt;/div&gt;
                              &lt;div class="col-xs-5"&gt;
                                  &lt;input type="text"/&gt;
                              &lt;/div&gt;
                          &lt;/form&gt;
                      &lt;/div&gt;
                      &lt;div class="row"&gt;
                          &lt;form class="navbar-form"&gt;
                              &lt;div class="col-xs-3"&gt;
                                  &lt;label for="desc1"&gt;Description 2&lt;/label&gt;
                              &lt;/div&gt;
                              &lt;div class="col-xs-5"&gt;
                                  &lt;input type="text"/&gt;
                              &lt;/div&gt;
                          &lt;/form&gt;
                      &lt;/div&gt;
                      &lt;div class="row"&gt;
                          &lt;form class="navbar-form"&gt;
                              &lt;div class="col-xs-3"&gt;
                                  &lt;label for="desc1"&gt;Url Display&lt;/label&gt;
                              &lt;/div&gt;
                              &lt;div class="col-xs-5"&gt;
                                  &lt;input type="text"/&gt;
                              &lt;/div&gt;
                          &lt;/form&gt;
                      &lt;/div&gt;
                      &lt;div class="row"&gt;
                          &lt;form class="navbar-form"&gt;
                              &lt;div class="col-xs-3"&gt;
                                  &lt;label for="desc1"&gt;Url Finale&lt;/label&gt;
                              &lt;/div&gt;
                              &lt;div class="col-xs-5"&gt;
                                  &lt;input type="text"/&gt;
                              &lt;/div&gt;
                          &lt;/form&gt;
                      &lt;/div&gt;
                      &lt;hr/&gt;
                  &lt;/section&gt;
              &lt;/section&gt;
              &lt;div class="buttons"&gt;
                  &lt;a href="#" rel="tooltip" id="make" class="btn btn-middle" style="outline: none;" data-placement="right" data-trigger="hover" data-content="cliquer dans la zone de texte, CTRL+C ou CMD+C pour copier." data-html="true"&gt;
                      &lt;span class="gradient"&gt;Générer Rapport&lt;/span&gt;
                  &lt;/a&gt;
              &lt;/div&gt;
              &lt;!-- &lt;span class="pull-right"&gt;cliquer dans la zone de texte, CTRL+C ou CMD+C pour copier&lt;/span&gt; --&gt;
              &lt;!-- &lt;button class="btn btn-success pull-right btn-s"&gt;&lt;a class="white" id="copy-button"&gt;Copier !&lt;/a&gt;&lt;/button&gt; --&gt;
              &lt;textarea onclick="this.select();" id="report" cols="160" rows="10" class="bg-grey"&gt;&lt;/textarea&gt;
  
  
          &lt;/div&gt;
  
          &lt;div id="templates" class="hidden"&gt;
              &lt;div class="row"&gt;
                  &lt;form class="navbar-form"&gt;
                      &lt;div class="col-xs-3"&gt;
                          &lt;label for="var1"&gt;{{var1}}&lt;/label&gt;
                      &lt;/div&gt;
                      &lt;div class="col-xs-5"&gt;
                          &lt;input type="text" id="var1" class="var" style="width: 350px;"/&gt;
                      &lt;/div&gt;
                      &lt;div class="col-xs-4"&gt;
                          0
                      &lt;/div&gt;
                  &lt;/form&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;section class="footer"&gt;
              &lt;div class="container"&gt;
                  &lt;hr/&gt;
  
                  &lt;div class="row"&gt;
                      &lt;div class="col-md-2"&gt;
  
                          &lt;div class="row margin-top-50"&gt;&lt;a href="http://link-tags.com"&gt;&lt;img src="assets/images/Logo149-40.png" alt="logo Link-tags"&gt;&lt;/a&gt;&lt;/div&gt;
  
                      &lt;/div&gt;
                      &lt;div class="col-md-3"&gt;
                          &lt;div class="row"&gt;&lt;/div&gt;
                          &lt;hr/&gt;
                          &lt;div class="row"&gt;Tout droits Réservés à &lt;a href="https://twitter.com/notcedricD"&gt;@notcedricD&lt;/a&gt; 
                          &lt;/div&gt;
                          &lt;hr/&gt;
                          &lt;div class="row"&gt;Réalisé avec l'aide de &lt;a href="https://twitter.com/sugatasei"&gt;@Sugatasei&lt;/a&gt;
                          &lt;/div&gt;    
                      &lt;/div&gt;
                      &lt;div class="col-md-4"&gt;
                          &lt;br/&gt;
                          &lt;br/&gt;
                          &lt;div class="alert alert-success text-center"&gt;Je partage&lt;/div&gt;
                          &lt;div&gt;
                              &lt;a href="http://twitter.com/home?status=G%C3%A9n%C3%A9rer+vos+annonces+%23AdWords+en+masse+en+quelques+clics+sur+http%3A%2F%2Flink-tags.com%2Fadgen%2Findex.html+via+%40notcedricD" title="Partager sur Twitter" target="_blank" class="btn btn-middle"&gt;&lt;span class="fa fa-twitter"&gt; Twitter&lt;/span&gt;&lt;/a&gt;
                              &lt;a href="https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Flink-tags.com%2Fadgen%2F" title="Partager sur Facebook" target="_blank" class="btn btn-middle"&gt;&lt;span class="fa fa-facebook"&gt; Facebook&lt;/span&gt;&lt;/a&gt;
                              &lt;a href="https://plus.google.com/share?url=http%3A%2F%2Flink-tags.com%2Fadgen%2F" title="Partager sur Google+" target="_blank" class="btn btn-middle"&gt;&lt;span class="fa fa-google-plus"&gt; Google+&lt;/span&gt;&lt;/a&gt;
                              &lt;a href="http://www.linkedin.com/shareArticle?mini=true&amp;title=Mass+Adtext+Generator&amp;url=http%3A%2F%2Flink-tags.com%2Fadgen%2F" title="Partager sur LinkedIn" target="_blank" class="btn btn-middle"&gt;&lt;span class="fa fa-linkedin"&gt; LinkedIn&lt;/span&gt;&lt;/a&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="col-md-3 widget-container widget-profile boxed"&gt;
                          &lt;div class="inner clearfix"&gt;
                              &lt;div class="avatar"&gt;&lt;img src="assets/images/cedric-duma.jpg" alt=""&gt;&lt;/div&gt;
                              &lt;h5&gt;Cédric Duma&lt;/h5&gt;
                              &lt;span class="subtitle"&gt;Consultant SEA&lt;/span&gt;
                              &lt;div class="follow"&gt;
                                  &lt;a href="https://twitter.com/notcedricD" class="btn btn-follow" style="outline: none;"&gt;&lt;span class="gradient"&gt;Suivez-moi&lt;/span&gt;&lt;/a&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
  
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/section&gt;
  
          &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"&gt;&lt;/script&gt;
          &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.min.js"&gt;&lt;/script&gt;
          &lt;script src="assets/js/app.js"&gt;&lt;/script&gt;
          &lt;script&gt;
  (function (i, s, o, g, r, a, m) {
  i['GoogleAnalyticsObject'] = r;
  i[r] = i[r] || function () {
      (i[r].q = i[r].q || []).push(arguments)
  }, i[r].l = 1 * new Date();
  a = s.createElement(o),
          m = s.getElementsByTagName(o)[0];
  a.async = 1;
  a.src = g;
  m.parentNode.insertBefore(a, m)
  })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
  
  ga('create', 'UA-31710454-3', 'auto');
  ga('send', 'pageview');
  
          &lt;/script&gt;
          &lt;script&gt;
              $('[rel=tooltip]').popover({html: true});
          &lt;/script&gt; 
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>