title: how to click on a glyphicon inside a input field
body: <p>I have an input field with a glyphicon</p>
  
  <pre><code>        &lt;div class="form-group has-feedback has-feedback-left"&gt;
            &lt;label class="control-label"&gt;Nome località: &lt;/label&gt;
            &lt;input type="text" class="form-control" value="" name="nome_loc" id="nome_loc"&gt;
            &lt;i id="cleanLoc" class="form-control-feedback glyphicon glyphicon-remove-circle"&gt;&lt;/i&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>The output visually is the following (as desired):</p>
  
  <p><a href="https://i.stack.imgur.com/H5c5W.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/H5c5W.png" alt="enter image description here"></a></p>
  
  <p>I want to trigger an event on click of the glyphicon but it seems that the event never fires. The js code is the following (in the documentReady block):</p>
  
  <pre><code>$('#cleanLoc').click(function(){
    $('#nome_loc').val('');
  });
  </code></pre>
  
  <p>This is just to clean the input field. What am I missing here?</p>