ons-tabbar hide with jQuery

I'm using onsen with ons-tabbar and want to hide/show the tabs with jquery. I want to hide the tabs in login page and show after login. This is my code:

<head>
    <meta charset="utf-8">

    <script src="http://debug-software.intel.com/target/target-script-min.js#h2kN-2HmemNy-2C0zFMFsSdJyBtr__GRx6CB-TI6nsA"></script>
    <link rel="stylesheet" href="css/onsenui.css">
    <link rel="stylesheet" href="css/onsen-css-components-blue-basic-theme.css">
    <link rel="stylesheet" href="css/login.css">

    <script src="js/SQLitePlugin.js"></script>
    <script src="js/angular/angular.js"></script>
    <script src="js/onsenui.js"></script>
    <script src="js/jquery-1.11.3.min.js"></script>

    <script>
        ons.bootstrap();
        //tabMenu.hideTabs = true;

        function OnIngresar() {
            tabMenu.hideTabs = false;
        }
    </script>
</head>

<body>
    <ons-tabbar var="tabMenu" id="tabMenu">
        <ons-tab page="pagIngreso" active="true">
            <ons-icon icon="star"></ons-icon>
        </ons-tab>

        <ons-tab page="pagNovedades">
            <ons-icon icon="comment"></ons-icon>
        </ons-tab>

        <ons-tab>
            <ons-icon icon="circle"></ons-icon>
        </ons-tab>

    </ons-tabbar>

    <ons-template id="pagIngreso">
        <ons-page id="pagLogin">
            <ons-toolbar fixed-style>
                <div class="center">Ingreso</div>
            </ons-toolbar>

            <div class="login-form">
                <input type="email" class="text-input--underbar" placeholder="Email" value="">
                <br>
                <br>
                <ons-button modifier="large" class="login-button" onclick="OnIngresar();">Ingresar</ons-button>
            </div>
        </ons-page>

    </ons-template> 

    <ons-template id="pagNovedades">
        <ons-page>
            <ons-toolbar fixed-style>
                <div class="center">Novedades</div>
            </ons-toolbar>
        </ons-page>
    </ons-template>

</body>

</html>

But when i press the button "Ingresar" nothing happends, how can I do?

Solution

I think it is not necessary to hide the tabbar in your situation. As I said in the previous comment, an easy solution is to show first a normal page with the login and then go to the main application (with the tabbar) on login success:

<ons-navigator var="nav" page="login.html"></ons-navigator>

<ons-template id="login.html">
    <ons-page>
    <ons-toolbar> <div class="center">Login page</div></ons-toolbar>
    Login form here...
    <ons-button onclick="doLogin();">Login</ons-button>
    </ons-page>
</ons-template>

<ons-template id="app.html">
    <ons-page>
        <ons-toolbar> <div class="center">My app</div></ons-toolbar>
        <ons-tabbar>
            tabs here...
        </ons-tabbar>
    </ons-page>
</ons-template>

Then login and go to the main app:

function doLogin() {
  console.log('login...');

  // On success
  nav.resetToPage('app.html');
}

Example here: http://codepen.io/frankdiox/pen/eNmNoz