How to dispense child element from click event

Question

Can somebody help me with this. There is HTML code:

<h3>
    <label>
        <input type="checkbox" name="country" value="us" /> United States
    </label>
</h3>
<p>Some content goes here</p>

I want to toggle p element by clicking on the h3 tag, but I don't wan't to toggle if I clicked on the label

$('h3').click(function() {
   // Does something goes here?
   $(this).next('p').toggle();
}

Answer 1

You need to check the target of the action

$('h3').click(function(e) {
   // if they clicked the h3 only
   if (this == e.target) {
     $(this).next('p').toggle();
   }
}

altCognito's suggestion would work also but it is more code.