I have a form that allows a user to create custom questions.

The user needs to insert the title for the question and then choose the type of the question (text, long text, radio button, checkbox or select menu).

If the type of question is a radio button, checkbox or a select menu it should appear a div "#availableOptions" that shows by default two input texts so the user can insert some option values.

When this "availableOptions" div appears there is also a button "add new option" that when is clicked it should appear another input text. Each option should also have always a remove button associated that when is clicked the user can remove that input text and the corresponding remove button, but if there is only one option (one input text) the remove should not work.

Do you know how to do this properly? I have the working example below but the append is not working, also the "availableOptions" div doesn't appear when an option with the class "optionQuestion" is selected, that is dont appears when the type of question selected is a radio button, checkbox or select menu.

Example: https://jsfiddle.net/hv89pdk3/1/