title: How to detect when one function is complete from another function?
body: <p>I have a javascript function that is being built to animate the collapse of a div, and then proceed with other jobs. The code is as follows:</p>
  
  <pre><code>function newsFeed() {
  
      var self = this;
  
      this.collapse = function(listingID,orig_height,curr_height,opacity) {
  
          var listing = document.getElementById(listingID);
          var reduceBy = 5;
          if(curr_height &gt; reduceBy) {
              curr_height = curr_height-reduceBy;
              listing.style.overflow = "hidden";
              listing.style.height = (curr_height-40) + "px";
  
              if(opacity &gt; 0) {
                  opacity = opacity - 10;
                  var opaque = (opacity / 100);
  
                  listing.style.opacity=opaque;                      
                  listing.style.MozOpacity=opaque;                   
                  listing.style.filter='alpha(opacity='+opacity+')';
              }
  
              setTimeout(function() { self.collapse(listingID,orig_height,curr_height,opacity); },1);
  
          }else{
  
              return true;
  
          }
      }
  
      this.remove = function(listingID) {
  
          var listing = document.getElementById(listingID);
          var currHeight = listing.offsetHeight;
  
          if (this.collapse(listingID,currHeight,currHeight,100)) {
  
                  // DO SOME OTHER STUFF
  
          }
  
      }
  
  }
  
  var newsFeed = new newsFeed();
  newsFeed.remove('closeMe');
  </code></pre>
  
  <p>I cannot get the this.remove function to wait while this.collapse finishes and returns true. Is this impossible? What is the best way to go on?</p>
  
  <p>Important: I would like to be able to use this.collapse with other functions yet to be built in the same fashion as I do here.</p>