Heading ## I want to dynamically onclick event on some particular word in the array coming from api, for which I have written some code which is not working

Blockquote The array which is coming from the api is in json format, in that we have to put the link or onclick event on the page dynamically like wikipedia, we have tried this, if you have any other way to do this then please share, will be grateful to you

import React, { useContext, useState, useEffect } from 'react';
import { ArticalContext } from '../context/context';
import reactStringReplace from 'react-string-replace';

export default function Fetchartical (props) {

const {deletArtical} = useContext(ArticalContext);
const {artical, updateartical} = props
const [split, setSplit] = useState(artical.description)

 useEffect(() => {return async () => {

   const replacedata = await reactStringReplace(split, 'प्रजापतिमजिग्रहत्', (match, i) => (
    <span key={i} onClick={handleclick} >{match}</span>
  ))
setSplit(replacedata); }}, [])



return (
    <>
        <div className="card  m-2" >
            <div className="card-body">
                <h5 className="card-title">{artical.title}</h5>
                <div dangerouslySetInnerHTML={{__html: '<p className="card-text">' + split + '</p>'}}></div>

            </div>
            <div className='flex m-2'>
            <button className='btn btn-primary mx-1' onClick={()=>{deletArtical(artical._id)}}> Delete</button>
            <button className='btn btn-primary mx-1' onClick={()=>{updateartical(artical)}} >Edit</button>
            </div>

        </div>
    </>
)

}