Making array's value.length dynamic

See more:

Javascript

HTML

jQuery

I have this code below that allows me to move the values from Green Fruits Table to Random Fruits Table by clicking on the row and vice versa. But the problem is when i move the values to another table the number beside the table header is not dynamic is there any easy way to make it update every time i move a row to another table? Any help would be greatly appreciated thanks!

What I have tried:

Here is my JSFiddle[^]