select all elements inside a p tag except on input element
<p>I have the following markup:</p>

<pre><code>&lt;div style="height:100px; width:280px; float:left" &gt;

&lt;p style="float:left; padding:5px;" id="optionOne"&gt;

&lt;label style="cursor:pointer; width:100px" id="optionLabelOne"&gt;Option 1&lt;/label&gt;
&lt;span style="color:red; font-size:10px"&gt;&lt;/span&gt;

&lt;input class="u-3" name="ageGroup" id="ageGroup" style="width:230px;" /&gt;
&lt;/p&gt;

 &lt;/div&gt;
</code></pre>

<p>I have several such repeating divs. I select <p> tags inside them like this:</p>

<pre><code>$('#optionOne,#optionTwo,#optionThree,#optionFour').on('mouseover',function(){
 $(this).on('mouseover',function(){
  //do something here});
  });
</code></pre>

<p>Now at some later stage i need to execute a click event on "p" tag excluding the "input" tag that lies within.</p>

<p>When i use the below code, click event fires up on input field as well (obvious)</p>

<pre><code>$(this).on('click',function(){
//do something
});
</code></pre>

<p>So what can be done to select the complete p tag without doing anything to input element within.</p>

<p>I tried this as well:</p>

<pre><code>$(this).not('input').on('click',function(){
 //// NOT WORKING
 });
</code></pre>

<p>Please comment.</p>
