JSFiddle - React, Tailwind, and code Playground

by chayacooper

HTML

<span class="complaint" id=Shoulders>
    <label>Shoulders</label>
 <select name=Shoulders>
  <option data-value="null" value="null">Select</option>
 <option data-value="Too_small" value="Too_small">Too Small</option>
 <option data-value="Too_big" value="Too_big">Too Big</option>
    <option data-value="Too_expensive" value="Too_expensive">Too expensive</option>   
</select>
</span>

<label>Ranking
<select name="importance_bother_shoulders" class="trigger_rank_increase1 trigger_rank_increase2 trigger_rank_decrease1 trigger_rank_decrease2 shoulders" data-name="Shoulders">
        <option value="Null">Select</option>     
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
    </select>
</label>

JavaScript

$(".trigger_rank_increase1, .complaint select").change(function() {    

var complaint= $(".complaint").val();   
    
    if(complaint === "Too_small"){
   document.write("Lucky 7!");
}
    
});