My jQuery .hover's are working fine, but I can't get .click to work

Question

My aim is to make this text change to opacity: 0 on click. However, I can't get it to respond.

HTML

<div class="click-contact">
    <h2 class="insignia-inner-text">contact</h2>
</div>

jQuery

jQuery(document).ready(function() { 
    jQuery(".click-contact").click(function() {
            jQuery(".insignia-inner-text").css({"opacity": "0"});
    }); 
});

JSfiddle: http://jsfiddle.net/Gy787/

I'm using wordpress so I have to run noConflict, but it's been working fine for all of my .hover functions.

Can anyone spot what I'm doing wrong?

Answer 1

You have not included jQuery in fiddle. It is working fine.

Answer 2

Make sure your contact are not loading dynamically in that case use :

jQuery(document).ready(function() { 
    jQuery("div").on('click','.click-contact', function() {
            jQuery(".insignia-inner-text").css({"opacity": "0"});
    }); 
});