const visibleCheckboxes = document.querySelectorAll('.checky') visibleCheckboxes.forEach(checkbox => checkbox.addEventListener('change', () => { let hiddenCheckbox = checkbox.nextElementSibling; checkbox.checked ? hiddenCheckbox.value = 'Yes' : hiddenCheckbox.value = 'No'; })) //html <label> <input type="checkbox" class="checky" /> <input type="text" value="no" /> Cats </label> <label> <input type="checkbox" class="checky" /> <input type="text" value="no" /> Dogs </label> <label> <input type="checkbox" class="checky" /> <input type="text" value="no" /> Fish </label>
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter