Personally, I would not stack the canvas on top of each other. A canvas is just a bitmap that displays all the pixels you need, so you only need one for most cases.
I would suggest using a library to help you manage different objects. I found that Grant Skinner EaselJS is a light breeze to work with.
This library allows you to easily group objects and add them to the canvas, and it also makes it trivial to add muscle listeners to capture clicks on objects, etc. that you will need to write a lot of code to use when using a canvas without a library.
There is documentation and examples on EaselJS .
EDIT:
Here is an excerpt from documents regarding container used to group objects.
A container is a list of displayed lists that allows you to work with composite display elements. For example, you can group arms, legs, torso and head raster images together into a Person container and transform them as a group, while maintaining the ability to move individual parts relative to each other. Container children have their transformation and alpha properties combined with their parent container. For example, a Shape with x = 100 and alpha = 0.5, placed in a container with x = 50 and alpha = 0.7, will be displayed on the canvas with x = 150 and alpha = 0.35. Containers have some overhead, so you usually should not create a container to hold one child.