I have a checkbox which is auto-generated from php, which is used to filter out search results depending on state. Additionally, a user can select district too to filter out results. In case a person selects a particular district instead of state, i want to automatically select the right state for that district using JavaScript and be able to focus. How can i use JavaScript code to select any checkbox and focus on it using JavaScript? Any assistance is much appreciated.
JSFiddle
<li class="cp_state">
<label class="title">State</label>
<div class="handle close dashicons-before"></div>
<div class="element">
<div class="scrollbox">
<ol class="checkboxes">
<li><input type="checkbox" name="cp_state[]" value="Johor" /> <label for="cp_state[]">Johor</label></li>
<li><input type="checkbox" name="cp_state[]" value="Kedah" /> <label for="cp_state[]">Kedah</label></li>
<li><input type="checkbox" name="cp_state[]" value="Kelantan" /> <label for="cp_state[]">Kelantan</label></li>
<li><input type="checkbox" name="cp_state[]" value="Wilayah Persekutuan Kuala Lumpur" /> <label for="cp_state[]">Wilayah Persekutuan Kuala Lumpur</label></li>
<li><input type="checkbox" name="cp_state[]" value="Wilayah Persekutuan Labuan" /> <label for="cp_state[]">Wilayah Persekutuan Labuan</label></li>
<li><input type="checkbox" name="cp_state[]" value="Melaka" /> <label for="cp_state[]">Melaka</label></li>
<li><input type="checkbox" name="cp_state[]" value="Negeri Sembilan" /> <label for="cp_state[]">Negeri Sembilan</label></li>
<li><input type="checkbox" name="cp_state[]" value="Pahang" /> <label for="cp_state[]">Pahang</label></li>
<li><input type="checkbox" name="cp_state[]" value="Wilayah Persekutuan Putra Jaya" /> <label for="cp_state[]">Wilayah Persekutuan Putra Jaya</label></li>
<li><input type="checkbox" name="cp_state[]" value="Perlis" /> <label for="cp_state[]">Perlis</label></li>
<li><input type="checkbox" name="cp_state[]" value="Pulau Pinang" /> <label for="cp_state[]">Pulau Pinang</label></li>
<li><input type="checkbox" name="cp_state[]" value="Perak" /> <label for="cp_state[]">Perak</label></li>
<li><input type="checkbox" name="cp_state[]" value="Sabah" /> <label for="cp_state[]">Sabah</label></li>
<li><input type="checkbox" name="cp_state[]" value="Selangor" /> <label for="cp_state[]">Selangor</label></li>
<li><input type="checkbox" name="cp_state[]" value="Sarawak" /> <label for="cp_state[]">Sarawak</label></li>
<li><input type="checkbox" name="cp_state[]" value="Terengganu" /> <label for="cp_state[]">Terengganu</label></li>
</ol> <!-- #checkbox-wrap -->
</div> <!-- #end scrollbox -->
</div> <!-- #end element -->
<div class="clr"></div>
</li>
