Nithin Nithin - 4 months ago 7
CSS Question

JQUERY, CSS, event handlers

I am supposed to use Jquery to call a function that changes a div's visibility using css. This is my JQUERY

alert("Interactive on line");
function changeView(page)
alert("Handler for click() called. ");
if(page === 'home)
$('#HomeTab').on('click', { page:'home'}, changeView());

I used the alert statement inside the changeView to see if changeView ever gets called and it does not. The initial alert before the changeView function does get called, so the script is linked correctly.
Thank you in advance!


Refer .on( events [, selector ] [, data ], handler )

  • You are invoking/calling function, not assigning it as handler, Remove () after function name.

  • data object could be accessed using

  • Also correct the typo while using .css method, it is jQueryElement.css(PROPERTY,VALUE)

function changeView(e) {
  alert("Handler for click() called. ");
  if ( === 'home') {
    $('#HomeTab').css('display', 'none');
    //OR $('#HomeTab').hide();
$('#HomeTab').on('click', {
  page: 'home'
}, changeView);
<script src=""></script>
<div id='HomeTab'>Home Tab</div>