I am using CSS & Javascript Toolbox in WordPress , and I have an element that changes the opacity with the class="casa" . When I do onClick , I use this code, but it does not work:
<script type="text/javascript">
jQuery(document).ready(function($){
var casa = $('.casa');
$('.casa').on('click',function($){
$('.casa').css('opacity', '0.5');
});
})
</script>
How is this solved?
In the attribute of the function that you trigger with the click event, you are passing as parameter "$". Try to pass any other letter (which will help you to deal with the event later) and you will see how it works:
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script type="text/javascript">
$(function(){
$('.casa').on('click',function(e){
$(this).css('opacity', '0.5');
});
})
</script>
I have updated my answer
If you start with jQuery()... in the document ready you pass the parameter $ to be able to use it inside.
Then in on('click', function... you pass a parameter that contains the event if you need it within your function:
jQuery(document).ready(function($){
var casa = $('.casa'); casa.on('click',function(e){
$(this).css('opacity', '0.5');
});
})