JSFiddle - React, Tailwind, and code Playground

by marcobehr

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head></head>
<body>
    <select id="testSelection">
        <option value="a">a</option>
        <option value="b">b</option>
        <option value="c">c</option>
    </select>
    <p>
        <span>Current selection: </span>
        <span id="currentSelection"></span>
    </p>
    <p>
        <span>Current cloned selection: </span>
        <span id="currentClonedSelection"></span>
    </p>
</body>  
</html>

JavaScript

function changeHandler() {
    var selText = jQuery("#testSelection").find(":selected").text();
    var clone = jQuery("#testSelection").clone();
    var selCloneText = jQuery(clone).find(":selected").text();
    jQuery("#currentSelection").text(selText);
    jQuery("#currentClonedSelection").text(selCloneText);
}

jQuery("#testSelection").change(changeHandler);
changeHandler(); // initial call