How to insert an element between 3 and 4 button?

Question

HTML

there is a menu which I do so how to insert a picture between the 3rd and 4th element.

Answer 1

import React from 'react';

import { Link } from 'react-router-dom';
import classNames from 'classnames';

function Menu({ arr, pref }) {
  const [Active, setActive] = React.useState(0);

  return (
    <div>
      {arr.map((name, index) =>
        name != 'logo' ? (
          <Link to={pref[index]}>
            <div
              className={classNames('navig', {
                active: Active == index,
                navig2: index == 4,
              })}
              onClick={() => setActive(index)}
              key={`${index}_${name}`}>
              {name}
            </div>
          </Link>
        ) : (
          <img src="../img/logo2.png" alt="" className="logo" />
        ),
      )}
    </div>
  );
}

export default Menu;