title: How to wait for a jQuery toggle to finish before running another function?
body: <p>I am missing something really obvious but I can't make one of my methods to wait until a jQuery toggle is done. </p>
  
  <p>I have the following three methods:</p>
  
  <pre><code>const toggleContainer = function() {
    addAnswerContainer.toggle("slow");
  };
  
  const toggleButtons = function() {
    submitAnswerBtn.toggle("slow");
    cancelAnswerBtn.toggle("slow");
  };
  
  const changeText = function() {
    if( addAnswerContainer.is(":hidden") ) {
      addOwnAnswerBtn.text("Add your own answer" );
    }
    else {
      addOwnAnswerBtn.text("Hide adding answer");
    }
  };
  </code></pre>
  
  <p>All I want to do is to have something like this to work:</p>
  
  <pre><code>const toggleUI = function() {
    toggleContainer();
    toggleButtons();
    changeText(); // executes too fast
  };
  </code></pre>
  
  <p>The problem is that <code>changeText()</code> executes too quickly and every time it checks, the <code>addAnswerContainer.is(":hidden")</code> returns <code>false</code>, unless I <code>setTimeout</code> it for some seconds, which is not what I want. I tried with callbacks, also with Promises, but I just can't make it work. How can I make the <code>changeText()</code> to wait, until the <code>addAnswerContainer.toggle()</code> has done its job?</p>