Separating JS functions


#1

Lesson 5 - "Open the Menu" says that the correct answer is this:

var main = function() {
  $('.icon-menu').click(function() {
    $('.menu').animate({
      left: '0px'
    }, 200);

    $('body').animate({
      left: '285px'
    }, 200);
  });
};

Why will the following not work?

var main = function() {
    $('.icon-menu').click();
};

var click = function() {
    $('.menu').animate({
        left: '0px'
    }, 200);
    
    $('body').animate({
        left: '285px'
    }, 200);
};

Thanks!


#2

It won't work because you are defining click after you call it. Also, click is a reserved keyword you can't use.


#3

Thanks for replying!

So even if I reverse the order I'm defining the functions in, it still wouldn't work because it's reserved?