How to fire when click li element (react-paginate)

Question

guys. Thanks reading this question.

I want to fire a page change event when the button created by react-paginate is clicked, but I can't get it to work.

If using react-paginate. this create a DOM like below.

<ul>
  <li><a>1</a><li>
  <li><a>2</a><li>
  <li><a>3</a><li>
<ul>

I think this component fired onClick event when clicked <a> only.
For example.　I created page-nation button like below.

If I clicked part of background-color(white), don't fire event of change page. because don't clicked <a> tag(number) (that created by react-paginate automatically).

I want to fire to change page event on clicked <li> tag.
How to solve this? do you know any idea?

Answer 1

I add css like below.

a {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
}