How to limit event outcome to element of origin

If you had a component (custom elements need a hyphen in their names), then it would have its own view model that it would render its view with.

Thanks, but I’m not sure that’s what I’m seeing. If I code:

tag: can-simple,
view: <can-el>{{hovMessage}}</can-el><can-el>{{hovMessage}}</can-el>,
ViewModel: {
        hovMessage: {
            default: "I was set via can-simple"
        },

Then {{hovMessage}} above gets set to I was set via can-simple even though the tag immediately surrounding it is can-el. If I code another ViewModel with the can-el tag, whichever comes first in the <script> tag determines the text displayed to the user. See JS Bin - Collaborative JavaScript Debugging.


(Parenthetically, I’m finding that at least under Firefox, <canEl> does function as a custom element. I did some research and possibly the reason is that they inherit from HTMLUnknownElement. But I now understand that it’s not a good practice.)