Is it any way to merge together two javascript? : I just can't figure it out how to merge them together, or I always have to write a different one for all my popups? I tried different things but none of them them worked.


<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

     $(document).ready(function() {
                 $('#trigger').click(function() {
                   $('#overlay').fadeIn(300);
                 });
                 $('#close').click(function() {
                   $('#overlay').fadeOut(300);
                 });
               });
               $('#overlay').click(function(e) {
        if (e.target == this) {
          if ($('#overlay').is(':visible')) {
            $('#overlay').fadeOut(300);
          }
        }
      });

      $(document).ready(function() {
        $('#trigger2').click(function() {
          $('#overlay2').fadeIn(300);
        });
        $('#close2').click(function() {
          $('#overlay2').fadeOut(300);
        });
      });
      $('#overlay2').click(function(e) {
    if (e.target == this) {
    if ($('#overlay2').is(':visible')) {
    $('#overlay2').fadeOut(300);
    }
    }
    });

<!-- end snippet -->

