Jquery child element on change
<p>I am trying, using jquery, to trigger an event when a child element, in this case select, changes.</p>

<p><strong>Here is my HTML</strong>:</p>

<pre><code>&lt;div id="addForm" ng-repeat="forme in formes" class="row addForm"&gt;
    &lt;div class="col-lg-2 col-md-2 col-sm-3 col-xs-6"&gt;
        &lt;select id="geo_{{forme.id}}" ng-model="forme.geo" class="form-control"&gt;
            &lt;option value="rectangle"&gt;Rectangle&lt;/option&gt;
            &lt;option value="triangle"&gt;Triangle rectangle&lt;/option&gt;
            &lt;option value="cercle"&gt;cercle&lt;/option&gt;
        &lt;/select&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p><strong>The javaScript</strong> that is not working yet:</p>

<pre><code>$(document).ready(function () {
    $(document.body).on("change", "#addForm &gt; select", function () {
        alert(this.value);
    });
});
</code></pre>

<p>OR  </p>

<pre><code>$(document).ready(function () {
    $(document.body).on("change", ".addForm &gt; select", function () {
        alert(this.value);
    });
});
</code></pre>

<p>Both method are not working</p>

<p>What is wrong with this?</p>