title: jQuery event-delegation doesn't work for click on a div
body: <p>I have an index like this:</p>
  
  <pre><code>&lt;body&gt;
  &lt;div id="page-container"&gt;
    &lt;div id="header"&gt;
      &lt;div class="main"&gt;
        &lt;div class="content"&gt;
          &lt;div id="website-link"&gt;&lt;a href=""&gt;&lt;/a&gt;&lt;/div&gt;
          &lt;div id="cart"&gt;
            &lt;div class="price"&gt;120,00 €&lt;/div&gt;
            &lt;div class="cart-icon"&gt;&lt;img src="img/cart.png" /&gt;&lt;/div&gt;
            &lt;div class="items"&gt;0&lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="bottom"&gt;
        &lt;div class="content"&gt;
          &lt;div id="bradcrumbs"&gt;3D TOOL &amp;gt; Upload &amp;gt; &lt;span class="active"&gt; Customize&lt;/span&gt;&lt;/div&gt;
          &lt;div id="menu"&gt;
            &lt;ul&gt;
              &lt;li&gt;&lt;a href=""&gt;Help&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div id="main-content"&gt;
      &lt;div class="block-container" id="block-container"&gt;
      &lt;div id="tools"&gt;
        &lt;form action="#" enctype="multipart/form-data" method="post" id="uploader"&gt;
          &lt;input type="file" name="fileUpload" id="fileUpload"  style="display: none" multiple accept=".stl,.obj,.stp,.step"&gt;
          &lt;label for="fileUpload"&gt;
            &lt;div id="addmore" style="cursor: pointer"&gt;&lt;/div&gt;
          &lt;/label&gt;
        &lt;/form&gt;
        &lt;div id="checkout"&gt;Checkout&lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>using a jquery function i prepend this code inside block-container div:</p>
  
  <pre><code>&lt;div id='upload-container-&lt;?php echo $i;?&gt;'  class='upload-container'&gt;
          &lt;div class="form-data"&gt;
            &lt;div class="col col1"&gt;
              &lt;div class="col-content"&gt;&lt;img src="img/square.jpg" /&gt;&lt;/div&gt;
              &lt;div class="col-info"&gt;Nome del file&lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="col col2"&gt;
          &lt;div class="col-content"&gt;
            &lt;label class="label"&gt;MATERIALI&lt;/label&gt;
            &lt;div class="select-style"&gt;
              &lt;?php
                echo"&lt;select name='materiali' class='materiali' autofocus tabindex='20' &gt;";
                    foreach($oxmL-&gt;Materials-&gt;Material as $material)
                    {
                        echo "&lt;option value=$material-&gt;MaterialID&gt;$material-&gt;Name&lt;/option&gt;";
                    }
                echo"&lt;/select&gt;";
              ?&gt;
          &lt;/div&gt;
          &lt;label class="label"&gt;FINITURA&lt;/label&gt;
          &lt;div id="selectmateriali2"class="select-style"&gt;
            &lt;?php
              $id=$oxmL-&gt;Materials-&gt;Material['0']-&gt;MaterialID;
              echo"&lt;select name='materiali2' class='materiali2' id='materiali2' autofocus tabindex='20'&gt;";
              foreach($oxmL-&gt;Materials-&gt;Material as $material)
              {
                  if($material-&gt;MaterialID==$id)
                  {
                      foreach($material-&gt;Finishes-&gt;Finish as $finish)
                      {
                          echo "&lt;option value=$finish-&gt;FinishID&gt;$finish-&gt;Name&lt;/option&gt;";
                      }
                  }
              }
              echo"&lt;/select&gt;";
            ?&gt;
          &lt;/div&gt;
          &lt;label class="label"&gt;QUANTITA&lt;/label&gt;
            &lt;input name="quantity" id="quantity" type="number" class="quantita" min="1" step="1" value="1"&gt;
              &lt;/div&gt;
              &lt;div class="col-info"&gt;&lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="col col3"&gt;
              &lt;div class="col-content"&gt;
                &lt;div class="size-form"&gt;
                  &lt;div class="label"&gt;Resize&lt;/div&gt;
                  &lt;input class="size" type="text" value="100"/&gt;
                &lt;/div&gt;
                &lt;div class="size-text"&gt;Change the size of your object in percent&lt;/div&gt;
                &lt;div class="size-info"&gt;
                  &lt;div class ="box-title"&gt;
                  &lt;div class="title-icon"&gt;&lt;img src="img/3dpr-form-xyz-cube.png" /&gt;&lt;/div&gt;
                &lt;/div&gt;
                  &lt;div class="axis-area"&gt;
                  &lt;div class="axis axis-x"&gt;X: &lt;label for="x" class="labelx"&gt;2&lt;/label&gt;&lt;/div&gt;
                  &lt;div class="axis axis-y"&gt;Y: &lt;label for="y" class="labely"&gt;3&lt;/label&gt;&lt;/div&gt;
                  &lt;div class="axis axis-z"&gt;Z: &lt;label for="z" class="labelz"&gt;4&lt;/label&gt;&lt;/div&gt;
                &lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="col-info"&gt;
          &lt;div class="icons"&gt;
              &lt;div class="button button-duplicate"&gt;&lt;/div&gt;
              &lt;div class="button button-delete"&gt;&lt;/div&gt;
          &lt;/div&gt;
                &lt;div class="price"&gt;450.20 €&lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="item-info"&gt;
            &lt;div class="filename col col1"&gt; &lt;label for="filename"&gt;filename.ciops&lt;/label&gt;&lt;/div&gt;
            &lt;div class="icons col col2"&gt;
          &lt;div class="button button-zoom"&gt;&lt;/div&gt;
          &lt;div class="button button-duplicate"&gt;&lt;/div&gt;
          &lt;div class="button button-delete"&gt;&lt;/div&gt;
        &lt;/div&gt;
            &lt;div class="price col col3"&gt; &lt;label for="price" class="labelprice"&gt;450.20&lt;/label&gt; €&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>I want to had a click listener to the div with the "button button-duplicate" class, i made it like this:</p>
  
  <pre><code>$('#block-container').on('input','.quantita',quantityChanged);
  
      $('#block-container').on('input','.size',scaleChanged);
  
      $('#block-container').on('click','.button button-delete', function(){
          alert("ok");
          //some code
      });
  
      $('input[type=file]').on('change', prepareUpload);
  
      $('form').on('submit', uploadFiles);
  </code></pre>
  
  <p>but it doesn't works, instead every other listener in the page works using #block-container as static element. What can i do? Any suggestion? Thank you </p>