title: jQuery on 'click' on a dynamic generated list returns 'an empty string'
body: <p>I create a input list with this function:</p>
  
  <pre><code>function buildHTMLinputfields(data, form_id){
      var row$ = '';
      for(var i = 0; i &lt; data.length; i++){        
          row$ = " &lt;label for='check1'&gt;" + data[i].Attribute_Name + "&lt;input data-guid='" + data[i].GUID + "' type='checkbox' name='" + data[i].Name + "' value='" + data[i].Name + "' id='check1' checked='checked'&gt; " + data[i].Name + " &lt;/label&gt;&lt;br&gt;";
  
          $(form_id).append(row$);
      }
  }
  </code></pre>
  
  <p>Output on my website:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>        &lt;label for="check1"&gt;
          Adressierung
          &lt;input type="checkbox" checked="checked" id="check1" value="volladressierbar" name="volladressierbar" data-guid="17caabea-c313-48c9-b965-739ef8d09a1f"&gt; volladressierbar
          &lt;/label&gt;&lt;br&gt;
          
          &lt;label for="check1"&gt;
          Adressierung
          &lt;input type="checkbox" checked="checked" id="check1" value="teiladressierbar" name="teiladressierbar" data-guid="d4419b55-3bb1-4efd-8f1c-f2ae3ed46988"&gt; teiladressierbar
          &lt;/label&gt;&lt;br&gt;
          
          &lt;label for="check1"&gt;
          Empfänger
          &lt;input type="checkbox" checked="checked" id="check1" value="privat" name="privat" data-guid="c14733e5-64f1-4141-a366-a9fd5dfa0aff"&gt; privat
          &lt;/label&gt;&lt;br&gt;
          
          &lt;label for="check1"&gt;Empfänger&lt;input type="checkbox" checked="checked" id="check1" value="Gewerbe" name="Gewerbe" data-guid="6febb58c-8c1d-4f84-a647-5409107c2002"&gt; Gewerbe
          &lt;/label&gt;&lt;br&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>So good... I've some input checkboxen.</p>
  
  <p>Now I want to get a alert or console.log output if I click on one checkbox.</p>
  
  <p>This is my function for it (<strong>Here is the problem I think</strong>):</p>
  
  <pre><code>function test(){
      $('body').on('click', 'input', function(){
          var text = '';
          text = $('#check1').text(); // empty???
          console.log(text); // Output -&gt; (an empty string)
      });
  }
  </code></pre>
  
  <p>The console says me: <em>(an empty string)</em></p>
  
  <p>I search a whole time in Google and SO but I can't find my issue.</p>
  
  <p>I try this (without success):</p>
  
  <p><a href="https://stackoverflow.com/questions/14418451/click-event-on-dynamically-generated-list-items-using-jquery">Click event on dynamically generated list items using jquery</a></p>
  
  <p><strong>For your information (I think it is important) - I initialize the functions here:</strong></p>
  
  <pre><code>function ip_get_order_filters(){
      var cookie_value_bearer = getCookie('ip_token');
  
      var setHeader = function (xhr) {
          xhr.setRequestHeader('Authorization', "Bearer " + cookie_value_bearer);
      };    
  
      $.ajax({
          crossdomain: true,
          url: 'https://testapi.***.de/***',
          type: 'GET',
          contentType: 'application/x-www-form-urlencoded',
          beforeSend: setHeader,
          dataType: 'json',
          success: function (data) { 
              buildHTMLinputfields(data, '#filterform'); //generate the input list
              test();
          }        
      });    
  }
  </code></pre>