Select the inner text of a div when selecting checkbox

Viewed 60

When I click on the checkbox it alerts all title inside the div's. I need it only to alert the title inside the div that I click on. I hope that any one can help me with javascript code (not jquery)

var serviceChecked = document.querySelectorAll('.checkbox__toggle');
var serviceTitle = document.querySelectorAll('.serveTitle');

serviceChecked.forEach(function(listItem) {
  listItem.addEventListener('click', function(e) {
    for (var t = 0; t < serviceTitle.length; t++) {
      alert(serviceTitle[t].innerText);
    }
  });
});
<div class="checkdivwrp">
  <div class="checkwrp">
    <input class='checkbox__toggle' type='checkbox'>
  </div>
  <div class="titlewrp">
    <div class="serveTitle">title 1</div>
  </div>
</div>
<div class="checkdivwrp">
  <div class="checkwrp">
    <input class='checkbox__toggle' type='checkbox'>
  </div>
  <div class="titlewrp">
    <div class="serveTitle">title 2</div>
  </div>
</div>
<div class="checkdivwrp">
  <div class="checkwrp">
    <input class='checkbox__toggle' type='checkbox'>
  </div>
  <div class="titlewrp">
    <div class="serveTitle">title 3</div>
  </div>
</div>

3 Answers
Related