title: Best way to organize jQuery/JavaScript code (2013)
body: <h2>The Problem</h2>
  <p>This answer has been answered before but are old and not up to date. I have over 2000 lines of code in a single file, and as we all know this is bad practice, especially when i'm looking through code or adding new features. I want to better organize my code, for now and for the future.</p>
  <p>I should mention that I'm building a tool (not a simple website) with lots of buttons, UI elements, drag, drops, action listeners/handlers and function in the global scope where several listeners may use the same function.</p>
  <h3>Example code</h3>
  <pre><code>$('#button1').on('click', function(e){
      // Determined action.
      update_html();
  });
  
  ... // Around 75 more of this
  
  function update_html(){ .... }
  
  ...
  </code></pre>
  <p><a href="http://pastebin.com/PrbwanNZ" rel="noreferrer">More example code</a></p>
  <h3>Conclusion</h3>
  <p>I really need to organize this code for best use and not to repeat myself and be able to add new features and update old ones. I will be working on this by myself. Some selectors can be 100 lines of code others are 1. I have looked a bit at <code>require.js</code> and found it kinda repetitive, and actually writing more code than needed . I'm open to any possible solution that fit this criteria and link to resource / examples are always a plus.</p>
  <p>Thanks.</p>