Default disabled button click event is not firing on reactjs

I have button which by default was disabled. But when the checkbox was selected, button will be enabled, using ref i am enabling the button. After the button activated click event is not firing. Without the default disable, button's click event was firing.

            <button
                className="btn btn-danger" 
                ref={element => {
                    this.actionButtonRef = element;
                }}
                onClick={event => {
                    console.log("clicked");
                }} 
                disabled=""><Trans>DELETE_ALL</Trans></button>

            <th key="checkboxall">
                <input 
                    type="checkbox" 
                    ref={element => {
                        this.checkboxAllRef = element;
                    }}
                    onChange={event => this.onChangeCheckBox(event)}/>
            </th>

onChangeCheckBox(event) {
    if(event.target.checked) {
        this.actionButtonRef.disabled = "";
   }
  else {
        this.actionButtonRef.disabled = "disabled";
  } }

Here is the jsfiddle jsfiddle.net/Sivabalan/en1fax58

If anything i did wrong means, let me help guys