Introduction to the design and implementation of MultiSelect control of left and right choice _jquery

Due to the use of the selected control in the project, the Internet has found some related implementation, there are basically two:
1, based on the jquery UI control:

This looks good, and the use of the function is also relatively complete, but with the traditional left choice to the right side of the way, a little awkward.
2, a brother handwriting of a control:

This meets my needs, simple and practical, but does not meet my other needs, my demand is the right choice box needs to be able to choose a different color picture, and this style is a bit unattractive.

Zennai himself to write a bar, cost me half a day of strength, finally finished, posted out to share with you:

This satisfies the requirements of my function and meets my requirements for the style.
About color selection I quote a plug-in from a third party jquery.colorPicker.js, I prefer the simple and practical and beautiful things.
On the code, too many inconvenient to post, say my implementation, the control is using the jquery Easy UI DataGrid control, I also tried a few controls, only this meets my requirements, of course, for the DataGrid also did some remove the title, Manually modify some of the style's processing. The right and left choice and upper and lower control basically the logic is the same, is called the DataGrid some methods to achieve, of course, the control of the gray button also do a lot of logic control, the purpose is to make users more convenient to use.