How to override div onClick event when button is clicked?

Question

I am trying to stop the parent div from executing an onClick event when the child Delete button is clicked.

<div>
    {notes.map((val) => {
       return 
      <div key={val.id} onClick={() => Logic.selectNote(val.note, val.id)} className="editorDiv">
      <Delete className="delBtn" onClick={(e) => del(e, val.id)}></Delete>
      <ReactQuill className="note" value={Logic.limitDisplayText(val.note)} readOnly={true}  /></div>
    })}
</div>

I tried to implement event.stopPropogation however, it gives me an error.

function del(e, noteId) {
        e.stopPropogation()
        localStorage.removeItem(noteID)
    }