I am having the following
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
</head>
<body>
<form>
<input id="bc_hare_status_inp" value="<script>alert('hi')</script>" name="bc_hare_status_inp" />
</form>
<div style="margin-top:20px" id="hare_status">
<select name="hare_status">
<option value="10">10</option>
</select>
</div>
</body>
</html>
currently we have script code at $(“#bc_case_status_inp”).val()`
case1: the below does not have any affect but the codeql says Dom text reinterpreted as HTML. Because the script tag inside value of input cant run the script
var caseStatus = $("#bc_case_status_inp").val();
rp_html = `<input type="text" value="${caseStatus}" style="width:250px">`
$('select[name="case_status"]').replaceWith(rp_html);
case2: the below runs the script and its agree to see Dom text reinterpreted as HTML
var caseStatus = $("#bc_case_status_inp").val();
rp_html = `${caseStatus}`
$('select[name="case_status"]').replaceWith(rp_html);
should we take steps to overcome XSS attack even in case 1, case 2 is obvious