Website Developping

i have developed a website using JSP n Servlets, now i want to make my website dynamic, like city wise content should change (for example i have different list of contents for different cities when a user select some city XYZ my website should display only tat particular XYZ city’s content rest of the contents should hide or shouldn’t display). How to do this functionality. I was thinking about div hide and show concept but my content in webpage is huge it won’t affect performance? if it is not how to achieve this with example. and if their is any other concept please guide me how to achieve this functionality.
Thanks in advance.

In my opinion, you can stored those data in database, or in json/xml/text file.

Then, when user choose different cities, you load the content out regarding user’s choice.

You can try with web API, and other basic knowledge of web services as well as database / noSQL.

If you have multiple cities in your display list, it will take a lot of time to load your page

Finally, you should change the question tags, questions Header to identify easily

UPDATE:
If you really insist on using javascript to show/hide the City content, then you can try with my example: Show/hide div with javascript

I wrote a simple one ( of course not the most optimize) so you can imagine how can it be done.

var cityList = ["City1", "City2", "City3"];
var citypick = document.getElementById('mySelect');
citypick.onchange= displayFunction;

function displayFunction() {
    for(var i =0; i< cityList.length;i++){
      var selectCity = document.getElementById(cityList[i]);
      if(selectCity.id == citypick.value){
        selectCity.style.display = 'block';
      }
      else{
        selectCity.style.display = 'none';
      }
    }
}