jQuery 不会在第一次点击时触发，但在第二次点击时触发

$(document).ready(function() {
    $('#talents li').on('click',  'div', function(event) {
        event.stopPropagation();

        $(event.target).addClass('--active');
        talents_points = $('.--active').length;
        _this.setState({ points: talents_points });
        this.handlePointsMaxed(talents_points);
    });
    $('.no-right-click').bind('contextmenu', function(event) {
        event.stopPropagation();

        $(event.target).removeClass('--active');
        talents_points = $('.--active').length;
        _this.setState({ points: talents_points });
        // this.handlePointsMaxed(talents_points);

        return false;
    });
});

<ul id="talents">
    <li onClick={this.handlePointsClicks}>
        <div id="talent-stacks" className="talent-image__stacks"></div>
    </li>
</ul>`

知道为什么吗？我确信它是在鼠标按下和单击功能上，但我需要它们来完成我的制作，并且还没有找到另一种方法来组合这些功能。

EDIT:添加了上下文的 HTML 示例

我能够解决这个问题，我没有在反应组件的 componentDidMount 生命周期中正确设置函数。

谢谢各位的意见。