React + jQuery -> Button onClick is not working

Using ReactJS and jQuery I am adding buttons dynamically to specific div id's in my component like so:

$('id_name').html('<button>..text..</button>);

However, each of these buttons needs to have onClick functionality, and that is where my problem is.

The code that I need help with is this:

export default React.createClass({

        ....

    for(var i = 0; i<this.state.cells.length; i++){
          var id = '#'+this.state.cells[i];
          var mb = $(id).text();
          if(mb.length==0){
            $(id).html("<div id='"+ id +"' class='time-slot'> \
                            <button onClick="+this.buttonActivated()+"> \
                                <span id='message-"+id+"'>Not Assigned</span> \
                            </button> \
                       </div>");
          }
    }

         ....

    buttonActivated: function(){
        console.log("Button Clicked");
    },

         ....

});

What is actually happening is that when this page renders the function is run automatically for every button that is rendered, so I am getting 15 console logs saying "Button Clicked", but when I click any of the buttons the function is not triggered.