Merge two similar click event into one
<p>this is a recurrent problem in writing my javascript : I have the events :</p>

<pre><code>$(document).on('click','.mi_piace_brick',function(){ 
   $this = $(this).children(),
   $that = $(this),
   i = s.get_current_step_id(),
   j = $that.attr('data-class'),
   counter = parseInt($('.like_counter_'+i+'_'+j).first().find('p').text());

   if($this.hasClass('liked')){
      $this.removeClass('liked');
   $('.like_counter_'+i+'_'+j).find('p').text(--counter);
   }
   else{
     $this.addClass('liked');
   $('.like_counter_'+i+'_'+j).find('p').text(++counter);
   }
  })
</code></pre>

<p>And </p>

<pre><code>   $(document).on('click','.pref_brick',function(){ 
    $this = $(this).children(),
    $that = $(this),
    i = s.get_current_step_id(),
    j = $that.attr('data-class'),
    counter = parseInt($('.fav_counter_'+i+'_'+j).first().find('p').text());

        if($this.hasClass('preferito')){
        $this.removeClass('preferito');

        $('.fav_counter_'+i+'_'+j).find('p').text(--counter);
    }
    else{
        $this.addClass('preferito');
            $('.fav_counter_'+i+'_'+j).find('p').text(++counter);
        }
        })
</code></pre>

<p>As you can see, the two functions are basically really similar. I'm encountering really often in such situations. There's a way, in your opinion, to use only one binding to do the trick?</p>
