javascript - lists are not clickable in reactjs -

i have list of destination name should clickable , show result lists not clickable .i have tried writing console.log in click event function nothing traced in console too.

destination-list

var react = require('react/addons'); var destination = require('./destination.js.jsx');  var destinationslist = react.createclass({   mixins: [     react.addons.purerendermixin   ],   ondestinationclick: function(destination) {     console.log('destination clicked');     console.log(destination);     this.props.ondestinationclick(destination);   },   renderdestinations: function() {     var _self = this;     var selecteddestination = _self.props.selecteddestination;     return this.props.destinations.map(function(destination, idx) {       var name = destination.name;       var slug = destination.slug;       var image = destination.image;       return <destination destination={destination} selecteddestination={selecteddestination} ondestinationclick={_self.ondestinationclick} key={'destination-' + slug}/>     });   },   render: function() {     return (       <div classname='destinations-list'>         <div classname='destinations-list-inner'>           {this.renderdestinations()}         </div>       </div>     );   }  });  module.exports = destinationslist; 

destination

var destination = react.createclass({   mixins: [     react.addons.purerendermixin   ],   ondestinationnameclick: function(event) {     console.log('event triggered',event);     this.props.ondestinationclick(this.props.destination);   },   render: function() {     var classes = this.props.selecteddestination === this.props.destination.slug ? 'destination selected' : 'destination';     return (       <div classname={classes}>         <div classname='destination-inner'>           <div classname='destination-name' onclick={this.ondestinationnameclick}>{this.props.destination.name}</div> // not clickable         </div>       </div>    );   } })   module.exports = destination;