如何根据其类使包含链接的div不可点击

Question

These are the previous and next buttons html code what i want to do is to disable them when another button called filter is clicked and further if some conditions are satisfied

 <div class="page-btn" id="page-next"><a href="testlink/index/3/1"><div class="pbtn-txt" style="color: whitesmoke;">Next </div></a></div>  

 <div class="page-btn" id="page-previous"><a href="testlink/index/3/1"><div class="pbtn-txt" style="color: whitesmoke;">previous </div></a></div>  

How can I disable them based on some condition? the links are generated at runtime. for example

$('.filter').click(function(){

                    if(condition) {
        disable next links click using class page-btn;
        disable prev links click using class page-btn;
                    } 

});

Answer 1

$('.filter').click(function(){
     return false;
});

jsFiddle Demo

Edit:

If the classes change dynamically, this is a better approach that will support it:

$(document).on("click", ".filter",
    function () {
        return false;
    });

jsFiddle Demo

Edit 2:

After you've described your problem better, this is probably what you're looking for:

$('.filter').click(function(){

      if (condition) {
          $(".page-btn a").click(
              function () { return false; }
          );
      } 
});

Answer 2

This code checks the class of the link when clicked:

<script type="text/javascript">
    $(function() {    
        $('.filter').on('click', function(){
            if(condition)
               $(".page-btn a").attr('href', 'javascript:void(0);');
        });
    });
</script>

Answer 3

Or You could use

$('.filter').click(function(e){
                if(condition) {
                  e.preventDefault();
                } 
});