<a href="#" class="edit"><img src="edit.png">
<a href="#" class="delete"><img src="delete.png">
The code is dynamically saved (along with the static group name) as an invisible attribute in the containing div and is not altered at all. The bug however occurs when the code is restored. What happens is when edit.png is bound to function edit(e) and delete.png is bound to del(e), when edit.png is clicked edit(e) and del(e) functions are both triggered while when delete.png is clicked only del(e) is triggered.
Even at this time I have no idea what is the cause of the bug. However the fix is quite simple. After playing around with global flags and setTimeout flag reset I discovered a simple check to ensure that the event is being intentionally triggered. The trick is to check e.target.src which will be undefined for del(e) when edit.png is clicked because it was not actually triggered by the user but by either a browser or html bug. While I did not test it, a check for only e.target should work fine for this problem as well.
Hopefully this tip can save you a lot of time as I tried Googling for a solution for about just as long as I tried to code a solution for it my self, shifting around the link/image positions, adding separator divs, and other crazy solutions to no avail. Unfortunately the trick to solving these kinds of problems are not always clear however the general rule should always be to check whatever data is available; doing that would've saved me at least 3 hours.