使用：之后创建可点击区域

Question

我这里有一个jsfiddle - http://jsfiddle.net/nvz7q39b/

是否可以使用：after创建可点击的区域。

我可以在使用：after创建的区域中添加一个类，然后使用jQuery / Javascript向其中添加一个事件。

        .block{
            background: #ddd;
            height: 50px;
            position: relative;
        }

        .block:after{
            background: red;
            content: "";
            display: block;
            width: 50%;
            height: 50px;  
            z-index: 100;
        }