I am about to create a page that has a list to the left and the actual content to the right. When the user clicks on one of the items in the list, the item should turn yellow and an arrow should point to the right. The arrow will partially be outside the list panel. Se picture below.

arrow on active element.PNG

I have thought about creating the arrow with HTML5 canvas element, is that the right way? How do I get the arrow to go over the panels border?