JQuery: Open/Close Menu, Opens but doesn't close

Question

I'm trying to do a menu that hides on the left side and when we click on the button it opens or closes. I have the following code but the menu just opens, the code for closing isn't working, someone have a clue about what I did wrong?

 var menu = function() { /* Open Menu*/ $('.js_open_seta').click(function() { $('.js_menu').animate({ left: "0px" }, 200); $(".js_open_seta").addClass("js_close_seta"); $(".js_open_seta").removeClass("js_open_seta"); }); /* Close Menu*/ $('.js_close_seta').click(function() { $('.js_menu').animate({ left: "-240px" }, 200); $(".js_close_seta").addClass("js_open_seta"); $(".js_close_seta").removeClass("js_close_seta"); }); }; $(document).ready(menu); 

 body{ background: url("imagens/exp.jpg"); background-repeat: no-repeat; background-size: 1280px 800px; padding: 0; margin: 0; border: 0; } .js_menu{ background: #4d4d4d; top: 0px; left: -240px; position: fixed; width: 310px; height: 100%; text-align: center; font-family: 'Lato', sans-serif; color: #ffffff; z-index: 50; padding: 0; margin: 0; border: 0; } #js_exp, #js_open{ float: left; background: #4d4d4d; height: 100%; } #js_exp{ width: 240px; } #js_open{ border-left: #ff0000; width: 70px; text-align: center; vertical-align: middle; } #js_seta{ margin-top: 325px; width: 70px; height: 70px; } 

  <link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css'> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <nav class="js_menu"> <section id="js_exp"> <a href="#">SMPC</a> <a href="#">NGC Informática(2015)</a> <a href="#">NGC Informática (2015-2016)</a> </section> <section id="js_open"> <img src="http://vignette1.wikia.nocookie.net/ladygaga/images/4/40/Seta.png/revision/latest?cb=20110522223038&path-prefix=pt" class="js_open_seta" id="js_seta"/> </section> </nav> </div> 

Answer 1

    var menu = function() {


    $('#js_seta').click(function() {

    var check = $("#js_seta").hasClass("js_open_seta");        

        if(check) {
            $('.js_menu').animate({
                left: "0px"
            }, 200);

            $(".js_open_seta").addClass("js_close_seta");
            $(".js_open_seta").removeClass("js_open_seta");

        } else {
            $('.js_menu').animate({
                left: "-240px"
            }, 200);

            $(".js_close_seta").addClass("js_open_seta");
            $(".js_close_seta").removeClass("js_close_seta");

        }

    });

};


$(document).ready(menu);

This works