How to change label

Question

I have this code:

<label ng-repeat="day in days">
    <input type="checkbox" ng-model="activityDays[$index]" /> {{day}}
    <br />
</label>

How can I change text of label when checked?

you can use something like this [**fiddle**](http://jsfiddle.net/ykd8eo7o/) hiding and showing content when `:checked` — Vitorino fernandes, Dec 10 '14 at 12:44
possible duplicate of [Is there a CSS parent selector?](http://stackoverflow.com/questions/1014861/is-there-a-css-parent-selector) — Paulie_D, Dec 10 '14 at 12:50

Weafs.py · Answer 1 · 2014-12-10T13:12:21.040

Using JavaScript, you can loop through the input's parent's children, and change its .data if its day.

var checkbox = document.querySelector('input[type=checkbox]');

checkbox.addEventListener('change', function() {
  if (this.checked == true) {
    for (i = 0; i < this.parentNode.childNodes.length; i++) {
      if (this.parentNode.childNodes[i].data !== undefined) {
        if (this.parentNode.childNodes[i].data.trim() == 'day') {
          this.parentNode.childNodes[i].data = 'night'
        }
      }
    }
  } else {
    for (i = 0; i < this.parentNode.childNodes.length; i++) {
      if (this.parentNode.childNodes[i].data !== undefined) {
        if (this.parentNode.childNodes[i].data.trim() == 'night') {
          this.parentNode.childNodes[i].data = 'day'
        }
      }
    }
  }
})

<label ng-repeat="day in days">
  <input type="checkbox" ng-model="activityDays[$index]" />day
  <br />
</label>

How to change label

1 Answers1