create unique select box options syudent conduct form
by davehol
HTML
<div
role="listbox"
class="tt-menu"
id="tfa_1337_listbox"
aria-expanded="false"
>
<div role="presentation" class="tt-dataset tt-dataset-20">
<div
role="option"
id="tt-4e8bb209-efb4-b8ea-fb9c-7cb5e6a559e5"
class="tt-suggestion tt-selectable"
>
UGRD Semester 1 2020
</div>
<div
role="option"
id="tt-64eeccf3-5fe9-b7bb-f154-a394ff16a2a3"
class="tt-suggestion tt-selectable"
>
UGRD Semester 1 2020
</div>
<div
role="option"
id="tt-45107c96-b6a9-de19-ba5f-18936f06cac7"
class="tt-suggestion tt-selectable"
>
UGRD Semester 1 2020
</div>
<div
role="option"
id="tt-944fd082-a00b-8eb6-98ad-fb5903e5e676"
class="tt-suggestion tt-selectable"
>
UGRD flexible term 2020
</div>
<div
role="option"
id="tt-944fd082-a00b-8eb6-98ad-fb5903e5e676"
class="tt-suggestion tt-selectable"
>
UGRD flexible term 2022
</div>
<div
role="option"
id="tt-944fd082-a00b-8eb6-98ad-fb5903e5e676"
class="tt-suggestion tt-selectable"
>
UGRD flexible term 2021
</div>
<div
role="option"
id="tt-944fd082-a00b-8eb6-98ad-fb5903e5e676"
class="tt-suggestion tt-selectable"
>
UGRD flexible term 2020
</div>
<div
role="option"
id="tt-944fd082-a00b-8eb6-98ad-fb5903e5e676"
class="tt-suggestion tt-selectable"
>
UGRD flexible term 2022
</div>
<div
role="option"
id="tt-944fd082-a00b-8eb6-98ad-fb5903e5e676"
class="tt-suggestion tt-selectable"
>
UGRD flexible term 2022
</div>
<div
role="option"
id="tt-944fd082-a00b-8eb6-98ad-fb5903e5e676"
class="tt-suggestion tt-selectable"
>
UGRD flexible term 2022
</div>
<div
role="option"
id="tt-944fd082-a00b-8eb6-98ad-fb5903e5e676"
class="tt-suggestion...
CSS
#tfa_1337_listbox > div {
display: flex;
flex-direction: column;
flex-direction: column-reverse;
}
JavaScript
var select = document.getElementById("tfa_1337_listbox").children[0].children
var opt = []
var flag = 1
for (let item of select) {
if (!opt.includes(item.textContent.trim())) {
opt.push(item.textContent.trim())
}
}
for (var i = 0; i < opt.length; i++) {
flag = 0
for (let item of select) {
if (item.textContent.trim() == opt[i]) {
if (flag >= 1) {
// console.log("removed")
item.style.display = 'none';
}
flag++
}
}
}