onChange and onClick inside a button doesn't work on I.E

Question

React: 16.

onClick in input field and onChange doesn't work on IE . It works smoothly on chrome.

Is adding two onclick causing this issue ? One on button and another on input field ?

<button onClick={this.addEventOnTimePicker()}>
  <div style={style.buttonContent}>
    <div style={style.buttonIcon}>
      <Clock style={style.iconStyle} />
    </div>
    <input
      style={style.timeInput}
      onClick={() => {
        this.timePickerToggle(!open);
      }}
      disabled={disabled}
      ref={instance => (this.dropDown = instance)}
      value={typeof time === 'string' ? time : moment(time).format('LT')}
      onChange={this.onTimeChange.bind(this)}
    ></input>
  </div>
</button>

timePickerToggle = open => {
  this.addEventOnTimePicker();
  this.setState({ open }, () => {
      ....
    }
  });
};

Answer 1

Final Working code on IE:

<div
  style={style.buttonContent}
  onClick={() => {
    this.timePickerToggle(!open);
  }}
>
  <div style={style.timeIcon}>
    <Clock style={style.iconStyle} />
  </div>
  <input
    style={style.timeInput}
    disabled={disabled}
    ref={instance => (this.dropDown = instance)}
    value={typeof time === 'string' ? time : moment(time).format('LT')}
    onChange={this.onTimeChange.bind(this)}
  ></input>
</div>