Jquery checkbox checked when i add text value input - html

Question

How can I toggle a checkbox by using a text input check and check automatically if it exists in the list?
For example :
if you write 222 in the input with id=222 will be checked
if already checked it will be unchecked
if is not found an alert will be shown
$(document).ready(function() {
$('#Scan').on('keypress', function(e) {
if (e.which == 13) {
Scan = $('#Scan').val();
//if value exsit in the list -> checked
//if value checked -> dechecked
//if value not exist -> alert not exist
}
})
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="Scan" name="Scan" type="text" autocomplete="off" placeholder="Tracking Number" autofocus>
<br/>
<input class="custom-control-input" type="checkbox" id="111" value="111">
<label for="111" class="custom-control-label">111</label>
<br/>
<input class="custom-control-input" type="checkbox" id="222" value="222">
<label for="222" class="custom-control-label">222</label>
<br/>
<input class="custom-control-input" type="checkbox" id="333" value="333">
<label for="333" class="custom-control-label">333</label>
<br/>
<input class="custom-control-input" type="checkbox" id="444" value="444">
<label for="444" class="custom-control-label">444</label>
<br/>
<input class="custom-control-input" type="checkbox" id="555" value="555">
<label for="555" class="custom-control-label">555</label>

Answer 1

You can check if your result collection has elements in it by using .length.
$(document).ready(function() {
$('#Scan').on('keypress', function(e) {
if (e.which == 13) {
Scan = $('#Scan').val();
target = $(`#${Scan}`);
if (target.length) {
target.prop('checked', !target.prop('checked'));
} else {
alert("Not found");
}
}
})
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="Scan" name="Scan" type="text" autocomplete="off" placeholder="Tracking Number" autofocus>
<br/>
<input class="custom-control-input" type="checkbox" id="111" value="111">
<label for="111" class="custom-control-label">111</label>
<br/>
<input class="custom-control-input" type="checkbox" id="222" value="222">
<label for="222" class="custom-control-label">222</label>
<br/>
<input class="custom-control-input" type="checkbox" id="333" value="333">
<label for="333" class="custom-control-label">333</label>
<br/>
<input class="custom-control-input" type="checkbox" id="444" value="444">
<label for="444" class="custom-control-label">444</label>
<br/>
<input class="custom-control-input" type="checkbox" id="555" value="555">
<label for="555" class="custom-control-label">555</label>
Reference for template literals, just in case.

Answer 2

Here is an example using your conditions specified in question.
My alert is not a true js alert as that will halt any further input changes, so i've created an alert function to show if [name="scan"] input value exists in your checkbox input ids.
See comments in my script...
// create input ids array
let input_ids = [];
// for each checkbox type input id
$('[type="checkbox"]').each(function() {
// get the input id
let input_id = $(this).attr('id');
// add input id to input ids array
input_ids.push(input_id);
});
// on input change in doc for elem [name="scan"]
$(document).on('input', '[name="scan"]', function(e) {
// [name="scan"] current input val
let val = e.target.value;
// if val exist in input ids array
if ($.inArray(val, input_ids) >= 0) {
// get this input by id
let $input = $('#' + e.target.value);
// if input is checked
if ($input.prop('checked')) {
// uncheck input
$input.prop('checked', false);
} else {
// else check input
$input.prop('checked', true);
}
} else {
// run alert
alert(e);
}
// stop propagation
e.stopPropagation();
});
// not found alert
function alert(e) {
// activate alert class
$('.alert').addClass('active');
// time out to hide
setTimeout(function() {
// remove class
$('.alert').removeClass('active');
}, 1000);
}
.alert {
position: fixed;
top: 10px;
right: 10px;
background: red;
padding: .25rem .5rem;
opacity: 0;
transition: all .5s ease;
color: #fff;
}
.alert.active {
opacity: 1
}
<input name="scan" type="text" autocomplete="off" placeholder="Tracking Number" autofocus />
<br />
<input class="custom-control-input" type="checkbox" id="111" />
<label for="111" class="custom-control-label">111</label>
<br />
<input class="custom-control-input" type="checkbox" id="222" />
<label for="222" class="custom-control-label">222</label>
<br />
<input class="custom-control-input" type="checkbox" id="333" />
<label for="333" class="custom-control-label">333</label>
<br />
<input class="custom-control-input" type="checkbox" id="444" />
<label for="444" class="custom-control-label">444</label>
<br />
<input class="custom-control-input" type="checkbox" id="555" />
<label for="555" class="custom-control-label">555</label>
<div class="alert">Not found</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 3

I wouldn't use jQuery, but if you insist:
$(function(){
const scan = $('#Scan'), cci = $('.custom-control-input');
let scanVal;
scan.on('input', ()=>{
let scanVal = scan.val(), good;
cci.each((i, n)=>{
if(scanVal === $(n).val()){
n.checked = !n.checked; good = true;
}
});
if(good === undefined && scanVal.length > 2){
alert('Never use Alert');
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="Scan" name="Scan" type="text" autocomplete="off" placeholder="Tracking Number" autofocus>
<br/>
<input class="custom-control-input" type="checkbox" id="111" value="111">
<label for="111" class="custom-control-label">111</label>
<br/>
<input class="custom-control-input" type="checkbox" id="222" value="222">
<label for="222" class="custom-control-label">222</label>
<br/>
<input class="custom-control-input" type="checkbox" id="333" value="333">
<label for="333" class="custom-control-label">333</label>
<br/>
<input class="custom-control-input" type="checkbox" id="444" value="444">
<label for="444" class="custom-control-label">444</label>
<br/>
<input class="custom-control-input" type="checkbox" id="555" value="555">
<label for="555" class="custom-control-label">555</label>