jQuery addClass example

Change class name on click in jQuery

by eget teteete

HTML

<p class="p1">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ex officiis consequatur quaerat velit dolores, mollitia minima nobis aut illum nostrum doloremque at harum impedit perferendis nam? Eos voluptatibus consectetur laborum!</p>
<p class="p2">Pariatur optio consequuntur numquam autem nisi earum, laboriosam error similique deserunt molestias repellat eius, quaerat dignissimos dicta itaque assumenda et adipisci perspiciatis, neque quibusdam repellendus voluptatem! Fugiat accusamus, ex rerum.</p>
<p class="p3">Distinctio, consequatur praesentium molestiae eum in molestias, beatae dicta, totam deserunt cum sed, esse illo fugiat. Illo neque a possimus temporibus explicabo. Laboriosam temporibus corporis, minima sequi dignissimos provident maiores?</p>
<button>watch more</button>
<span>
  Lorem ipsum dolor sit amet, consectetur adipisicing.
</span>
<span>
  Lorem ipsum dolor sit.
</span>

CSS

.p3 {
  display: none;
}

button {
  display: block;
  margin: 5px;
  background: space;
}

JavaScript

var btn = document.getElementsByTagName('button');
var p3 = document.getElementsByTagName('p')[2];
console.log(p3);
console.log(btn);
btn.addEventListener("click", function() {
      p3.style.display = 'block';
    });