# Menu tree item highlight after selection on click

**URL:** <https://forum.inductiveautomation.com/t/menu-tree-item-highlight-after-selection-on-click/89866>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [May 3, 2024, 3:43am UTC](https://forum.inductiveautomation.com/t/menu-tree-item-highlight-after-selection-on-click/89866 "2024-05-03T03:43:10Z")\
**Posts on this page:** 1\
**Showing post:** 7

<div class="post-metadata">

**Author:** ![Ujwal\_Wankhede](https://avatars.discourse-cdn.com/v4/letter/u/4af34b/32.png) [@Ujwal\_Wankhede](https://forum.inductiveautomation.com/u/Ujwal_Wankhede)\
**Post date:** [May 10, 2024, 7:09am UTC](https://forum.inductiveautomation.com/t/menu-tree-item-highlight-after-selection-on-click/89866/7 "2024-05-10T07:09:48Z")

</div>

Fantastic!  
Here is the script and style reference that works for me. The length of the menu tree can vary dynamically. If you prefer not to manually create a Map transform binding for each item, this solution could be quite helpful.

> **MenuTree\>onItemClicked**
>
> ```python
> def runAction(self, event):
> def clear_Style(items):
> # remove the style
> for node in items:
> node["style"] = {"classes":""}
> if len(node["items"]) > 0:
> clear_Style(node["items"])
> 				
> items = self.props.items
> path = event.path
> clear_Style(items)
> for node in path[:-1]:
> items = items[node]["items"]
> 	
> items[path[-1]]["style"] = {"classes":"menu_selected"}
> 
> ```

> **stylesheet.css**
>
> ```python
> .psc-menu_selected{
> background-color: var(--info);
> }
> 
> ```

---

_[View the full topic](https://forum.inductiveautomation.com/t/menu-tree-item-highlight-after-selection-on-click/89866)._