type Msg = DropdownItemClicked Int type alias Model = { isDropped : Bool , options : Array Thing , selected : Int } dropdownContainer : Model -> Html Msg dropdownContainer model = div [ class "dropdown-container" ] [ text "Dropdown!" , dropdown model ] dropdown : Model -> Html Msg dropdown model = if model.isDropped then droppedDowndown model else text "" droppedDowndown : Model -> Html Msg droppedDowndown model = model.options |> Array.toIndexedList |> (dropdownItem model.selected) |> div [ class "dropdown" ] dropdownItem : Int -> (Int, Thing) -> Html Msg dropdownItem selectedIndex (thisThingsIndex, thing )= div [ classList [ ("dropdown-item", True) , ("selected", selectedIndex == thisThingsIndex) ] , onClick (DropdownItemClicked thisThingsIndex) ] [ text thing.name ]