How to append html element in array of objects ( specific key value) in React Js

Question

I want to use Google material icon like <span className="material-icons">settings</span> in my object value. Below is sample code (array of objects). Have to add above span as value of 'icon' key?

Google material icon reference link

let buttonData = [
  {
    label: "",
    classNames: "headerButton",
    icon: faBrush,
    title: "Design",
    onClick: (e) => {
      this.setState({ ActiveButton: "Design" });
    },
    dropdownList: [["Design"]],
    contextMenuStyle: "listGroupBottom",
    contextListStyle: "lisItemBottom",
  },
  { }, {} ]

Tried below code in icon

1. icon: '<span className="material-icons">settings</span>'

2. icon: "<span className="material-icons">settings</span>"