I am trying to code a web page that has multiple buttons and DIVs. When Button 2 is clicked, the section 2 fades in and the old div fades out. I can't seem to figure this out.

```js
let btn1 = document.querySelector('.one');
let btn2 = document.querySelector('.two');
let div1 = document.querySelector('.section1');
let div2 = document.querySelector('.section2');
let active = document.querySelector('.active');

function changeDiv(el, dis) {
  el.style.display = dis;
}

btn1.addEventListener('click', () => {
  changeDiv(div1, 'none');
  div1.classList.add('active');
});

btn2.addEventListener('click', () => {
  changeDiv(div2, 'none');
  div1.classList.remove('active');
});
```

```html
<button class="one">One</button>
<button class="two">two</button>
<button class="three">three</button>
<button class="four">four</button>
<div class="section1">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam congue ultricies congue. </div>
<div class="section2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam congue ultricies congue. </div>
<div class="section3">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam congue ultricies congue. </div>
<div class="section4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam congue ultricies congue.</div>
```