<!DOCTYPE html>
<html>
<head>
    <title>JavaScript Project</title>
    <style>
       
    </style>
</head>
<body>
    <h1>JavaScript</h1>
    <div class="output"></div>
    <button class="btn">Click Me</button>
    <script src="pro1.js"></script>
</body>

</html>
const output = document.querySelector('.output');
const btn1 = document.querySelector('.btn');
const urls = ['test.txt','test1.txt','test2.txt'];
const headerOne = document.querySelector('h1');
const sel = document.createElement('select');
output.append(sel);
urls.forEach((el)=>{
    const opt = document.createElement('option');
    sel.append(opt);
    opt.value = el;
    opt.textContent = el;
})

btn1.addEventListener('click',(e)=>{
    getFile(sel.value);
})

function getFile(url){
    fetch(url).then(rep => rep.text())
    .then(data =>{
        headerOne.textContent = data;
    })
}