Last function not hiding divs in jquery

Question

I have a the functions below that do the following:

1. hides div

2. show divs when option selected is clicked

3. hides div when button is clicked.

The very last function is not working for some reason. The divs will not hide again.

$(function() {
  $("#event").hide();
  $("#events").hide();
  $("#myselect select").change(function() {
    var $selected = $('#myselect select option:selected');
    if (!$selected.hasClass('added')) {
     $('<li />', {
        'data-value': $selected.val(),
        text: $selected.text()
      }).appendTo('#events');
      $selected.addClass('added')
    }
    $("#event").show();
    $("#events").show();
  });
});

$(function() {
  $("#promo").hide();
  $("#promos").hide();
  $("#myselect2 select").change(function() {
    var $selected = $('#myselect2 select option:selected');
    if (!$selected.hasClass('added')) {
      $('<li />', {
        'data-value': $selected.val(),
        text: $selected.text()
      }).appendTo('#promos');
      $selected.addClass('added')
    }
    $("#promo").show();
    $("#promos").show();
  });
});

$(function() {
$('#grab1').click(function) {
$('#promo').hide();
$('#promos').hide();
});
});

Answer 1

For the last function, try something like this:

$(function() {
  $('#grab1').click(function() {
    $('#promo').hide();
    $('#promos').hide();
  })
});

Answer 2

$(function() {
     $("#event").hide();
      $("#events").hide();
      $("#promo").hide();
      $("#promos").hide();

      $("#myselect select").change(function() {
        var $selected = $('#myselect select option:selected');
        if (!$selected.hasClass('added')) {
         $('<li />', {
            'data-value': $selected.val(),
            text: $selected.text()
          }).appendTo('#events');
          $selected.addClass('added')
        }
        $("#event").show();
        $("#events").show();
      });

      $("#myselect2 select").change(function() {
        var $selected = $('#myselect2 select option:selected');
        if (!$selected.hasClass('added')) {
          $('<li />', {
            'data-value': $selected.val(),
            text: $selected.text()
          }).appendTo('#promos');
          $selected.addClass('added')
        }
        $("#promo").show();
        $("#promos").show();
      });

    $("#grab1").click(function(){
        $("#event").hide();
        $("#events").hide();
    });

     $("#grab2").click(function(){
        $("#promos").hide();
        $("#promo").hide();
    });
});