Javascript 将手动输入选项添加到所选下拉列表

我将选择的插件集成到我的下拉列表中。我想创建一个功能，如果下拉列表中的选项不适用于某个用户的表单，她可以单击“其他”并手动键入他们的响应。基本上，下拉列表中的最后一个选项是“其他”，如果用户单击它，他或她可以创建一个输入。在代码中的第一个下拉列表中，我将如何执行此操作？非常感谢

实验
$（函数（）{
$（“.select选择”）。已选择({
禁用搜索\u阈值：4
});
函数hide（）{
$（“#p1”）.parent（）.hide（）；
$（“#p2”）.parent（）.hide（）；
}
//在对可见元素调用.selected（）后调用hide
隐藏（）；
});
函数onSelect1（）{
$（“#p1”）.parent（）.show（）；
}
函数onSelect2（）{
$（“#p2”）.parent（）.show（）；
}
.选择{宽度：200px}
标题
清洁的
打捞
重建
所有权状态
在掌控中
留置权
丢失的
头衔统计
在掌控中
留置权
丢失的
丢失的
丢失的

如果我答对了，请尝试下面的内容

实验
$（函数（）{
$（“.select选择”）。已选择({
禁用搜索\u阈值：4
});
函数hide（）{
$（“#p1”）.parent（）.hide（）；
$（“#p2”）.parent（）.hide（）；
}
//在对可见元素调用.selected（）后调用hide
隐藏（）；
});
功能选择1（el）{
$（“#p1”）.parent（）.show（）；
var值=$（el）.find（'select'）.val（）
如果（值==‘其他’）{
$（el）.附加（“”）
}
其他的
{
如果（$（'#txtSelect'）。长度>0）{
$（'#txtSelect'）。删除（）；
}
}
}
函数onSelect2（）{
$（“#p2”）.parent（）.show（）；
}
.选择{宽度：200px}
标题
清洁的
打捞
重建
其他
所有权状态
在掌控中
留置权
丢失的
头衔统计
在掌控中
留置权
丢失的
丢失的
丢失的