Doesn't work in chrome - Select+JavaScript Options

[James432213]

Hi the follow code doesn't work in Chrome but it does in Internet Explorer, in that when option "W30 L30" is picked, "Low stock" doesn't display like it does in IE . Any ideas?
Thank you

CODE

        <select id="myJeanSize">      
            <option value="" onclick="checkStock();">Please select</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W26 L30 - Not available</option>
            <option value="" onclick="checkStock();">W26 L32</option>
            <option value="" onclick="checkStock();">W28 L30</option>
            <option value="" onclick="checkStock();">W28 L32</option>
            <option value="" onclick="checkStock();">W29 L30</option>
            <option value="" onclick="checkStock();">W29 L32</option>
            <option value="Low stock" onclick="checkStock();">W30 L30</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W30 L32 - Not available</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W30 L34 - Not available</option>
            <option value="" onclick="checkStock();">W31 L30</option>
            <option value="Only a few left!" onclick="checkStock();">W31 L32</option>
            <option value="" onclick="checkStock();">W31 L34</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W32 L30 - Not available</option>
            <option value="" onclick="checkStock();">W32 L32</option>
            <option value="" onclick="checkStock();">W32 L34</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W33 L30 - Not available</option>
            <option value="Low stock" onclick="checkStock();">W33 L32</option>
            <option value="Not in stock" onclick="checkStock();" disabled="disabled">W33 L34 - Not available</option>
            <option value="Only a few left!" onclick="checkStock();">W34 L30</option>
        </select>
        
        <p id="stockLevel"></p>
        
        <script>
            function checkStock(){
             var displayResult = document.getElementById("stockLevel");
             var mySelection = document.getElementById("myJeanSize").value;
            
             displayResult.innerHTML=mySelection;
            }
        </script>

This post has been edited by James432213: Mar 16 2019, 08:45 PM

[CharlesEF]

Try moving the onclick action from the <option> to the <select> element.

[James432213]

Try moving the onclick action from the <option> to the <select> element.

Yes! it works, and it makes the code tidier too.

[CharlesEF]

Glad it worked out for you. Yes, the <select> element supports the onclick action, not the <option> element.