Pass ID # to function in order to use one function instead of separate ones

Pass ID # to function in order to use one function instead of separate ones

I am trying to minimize the amount of script that I use on my website. I have sections of each page; each section has the same basic layout. The divs and images that I want to make appear and disappear all have nearly identical ids, the only difference is the number at the end of the id.

Is there a way to get one script to automatically detect which id number has been clicked and then show all elements with the same number at the end of the id? I would also like it to hide the elements in the hide function below (basically they are the elements that do not share the same id number).

I currently have everything working the way I want it to using multiple functions like the one below but I would like to handle everything in a single function if possible. Any help would be appreciated.

  1. $("#2thumbNail2 , #ledBar").click(function () {
         
          $("#type201 , #type203 , #type204").hide();
         
          $("#image201 , #image203 , #image204").fadeOut("slow");
         
          $("#image202").fadeIn("slow");

          setTimeout(function(){$("#type202").show();},300);

          //$("#2thumbNail2 , #ledBar").removeClass("unClicked").addClass("clicked");

          $("#2thumbNail1 , #2thumbNail3 , #2thumbNail4").addClass("unClicked").removeClass("clicked").stop().animate({opacity: 0.5}, "slow");
         
          $("#lbCP , #dba , #customization").addClass("unClicked").removeClass("clicked")

        });