title: JQuery/JavaScript - Timing problems
body: <p>I created a class that I tried to instanciate in order to see if it was handling the way I wanted, and it works fine. </p>
  
  <p>Actually, not as fine as I'd like to, <code>check[i].id()</code> will only appear in console when I pause the console at the <code>each</code> loop.</p>
  
  <p>Otherwise, nothing will show off and <code>check</code> will be <code>undefined</code>. I don't really understand where the problem lies, this is the first time I encounter this timing issue. I wondered if the problem came from my AJAX request being too slow, but isn't it supposed to wait for calculation before filling <code>check</code> var?</p>
  
  <p>Here is the code, I modified it a bit for clarity:</p>
  
  <pre class="lang-js prettyprint-override"><code>var Form = function(formSelector, buttonsSelector) {
    var id;
  
    return {
      // Index of specific form
      setId: function(val) {
        (!isNaN(val)) ? id = val: console.log('Id must be integer')
      },
      id: function() {
        return id
      },
  
      // Get selectors
      formSelector: function() {
        return formSelector
      },
      buttonsSelector: function() {
        return buttonsSelector
      },
  
      // Get all DOM elements
      getAll: function() {
        return $(formSelector)
      },
  
      // Get id related elements
      get: function() {
        return $(this.getAll()).get(id)
      },
      buttons: function() {
        var buttons = $(this.get()).find(buttonsSelector);
        var elements = [];
  
        var proceed = $.ajax({
          url: 'myURL.php',
          dataType: 'json'
        }).done(function(data) {
          $(buttons).each(function(i) {
            if ((data.id()).includes($(buttons[i]).attr('id'))) {
              var element = new Buttons($(buttons[i]), data[i].id);
  
              elements.push(element);
            }
          });
  
          return true;
        });
  
        if (proceed) return elements;
      }
    }
  }
  
  $(function() {
    var test = new Form('.whatever', '.whatever2');
    var check = test.buttons();
  
    $(check).each(function(i) {
      console.log(check[i].id());
    });
  });
  </code></pre>
  
  <p>Thanks!</p>