Change selected value based on selection

Question

Here's what I'm trying to do: If the user selects the “add new” option, I would like to add a text box and enter user input and save it in my message. This part works. The while loop provides other parameters that already exist in my database. If the user selects them, I would save the selected result in my message. However, I just can't get it to work. I tried another method for what would be in the if statement. I tried to set the id value which is not saved. I tried to do what I did for the else statement, but javascript does not parse the variable inside quotes, which means that I cannot pass the variable to a value. I am new to this. Can someone help me please. Thank you very much.

<label for="bbp_extra_field2">Your Idea</label><br>
<form>
     <select id="bbp_extra_field2"  onchange="addtextbox()">
        <option value ="new">Add New</option>;
        <?php 
            while ( bbp_replies() ) : bbp_the_reply();
                 $reply_id  =   bbp_get_reply_id();
                 $ideas     =   get_post_meta( $reply_id, 'bbp_extra_field2', true);
                echo "<option value='$ideas' selected>".$ideas."</option>";
            endwhile; ?>
    </select>
</form>
<div id="newidea"></div>
<script>
    var e = document.getElementById("bbp_extra_field2");
    var strUser = e.options[e.selectedIndex].value;
    function addtextbox() {

        if (strUser != "new") {
            return
        }     
        else {
            document.getElementById("newidea").innerHTML = "<input type='text' name='bbp_extra_field2'>";
        }        
    }
</script>

, , . . .

echo '<label for="bbp_extra_field2">Idea</label><br>';
echo '<select name="bbp_extra_field2" id="field2">';
echo '<option value ="new">Add New</option>';
while ( bbp_replies() ) : bbp_the_reply();
    $reply_id = bbp_get_reply_id();
    $ideas = get_post_meta( $reply_id, 'bbp_extra_field2', true);
    echo "<option value='$ideas' selected>".$ideas."</option>";
endwhile;
echo "</select>";

Answer 1

, , , , :

<label for="bbp_extra_field2">Your Idea</label><br>
<form>
     <select id="bbp_extra_field2"  onchange="addtextbox()">
        <option value ="new">Add New</option>
        <?php 
            while ( bbp_replies() ) : bbp_the_reply();
                $reply_id = bbp_get_reply_id();
                 $ideas = get_post_meta( $reply_id, 'bbp_extra_field2', true);
                echo "<option value='$ideas' selected>".$ideas."</option>";
            endwhile; ?>
    </select>
    <div id="newidea"></div>
</form>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script>    
<script>
$("#bbp_extra_field2").change(function() {
        var Selector    =   $(this).val();
        $("#newidea").html('<input type="text" value="'+Selector+'" name="bbp_extra_field2">');
    });
</script>

jsFiddle Demo:

https://jsfiddle.net/muu982tx/