Whenever handling an event in jQuery, be it a UI event or a programmatic event, it is very often required to pass some piece of data to it. It is common for novice developers to pull that data directly from globally scoped objects – variables or global DOM selectors – which is not the best practice, and with more sophisticated dynamic UIs it easily gets out of hand and becomes impossible to maintain in the longer run.
To avoid such issues, jQuery provides two easy mechanisms for passing data to event handlers. More after the jump.