Need Help in Select tag using JS(DOM)

I don’t know how to display Specific Information … When I select from the option and hit the button … Specific Info should display of the selected option …
I hope you guys understand my poor explanation :frowning:

code link: https://codepen.io/bilal-shuja/pen/jOrppdX?editors=1010

What specific information do you expect to display if you select a specific option?

Tell us exactly what you select and what you expect to see.

Currently you code creates the string “Balochistan Punjab Sindh Khyber Pakhtunkhwa” and the displays that string regardless which option is selected when the button is clicked.

^ Answering this would be helpful.

You need to add an event listener to the select element and listen for the “change” event. Then you can get, for example, the values (0,1,2).

document.getElementById('mySelection').addEventListener('change', (e) => {
  console.log(e.target.value)
})

If I select Pakistan from the drop down … and click … The declared array**(Provinces = [‘Balochistan’, ‘Punjab’, ‘Sindh’, ‘Khyber Pakhtunkhwa’])** info should display !!

So far you have created no logic that associates the Provinces array with the value 0 (the option for Pakistan. You could create an object containing the value options as keys and an applicable array of provinces for each country. This would allow you to create a lookup to build the applicable string of provinces only after the button is clicked.

I’m trying !! but failed to solve my problem yet :frowning:

Update your Codepen with the changes you have tried. It looks the same as it did earlier.