Bind Some Event to Element and trigger that function when click the element

Scenario:

Suppose if we used same click event function in various web pages. if you want do some logic some page button for that need to register the event

for buttons


Register events to button:

 $(document).ready(function(){
        $('.apply-filter').bind('beforeClick',function(event) {           
            if ($(this).data("value")=="10") {
                return true;
            }
            else return false;
        });
    });

Trigger the Registered function inside click event:

- creat event object using $.Event() metod and then trigger event by trigger(); method
- check the event prevented or not using event.isDefaultPrevented() based on that we can handle click event
- Button creations

 <div class="col-md-12" style="clear:both;">
            Button1 <button class="apply-filter" data-value="5">Five</button>
        </div>
        <div class="col-md-12">
            Button2 <button class="apply-filter" data-value="10">Ten</button>
        </div>
         <div class="col-md-12">
            Button2 <button class="apply-filter" data-value="15">Fifteen</button>
</div>