Javascript 单击列表时，显示所有数据以及图像/图标

上面是一个下拉列表，单击列表时，其值将与图像一起显示在上面的字段（顺便说一句，这是一个按钮）中。我已经实现了显示文本，但我似乎无法显示图像。下面是我的标记

<button type="button" onclick="showbanks(); return false;" name="button" class="banknam btn dropdown-toggle center-right glyph form-control d-inline-block" data-toggle="dropdown-menu" aria-haspopup="true" aria-expanded="false">广东</button>
    <ul class="dropdown-menu menu-banknam">
    @foreach (array_slice($chosen_bank,0,5) as $index =>$bank)
        <li value="{{$bank}}" onclick="clickbanks(); return false;">
            <span class="bankimg d-inline-block"><img src="{{ asset($chosen_bankimg[$index]) }}" alt=""></span>
            <span class="bank_nam d-inline-block">{{ $bank }}</span>
        </li>
    @endforeach
    </ul>

有没有办法做到这一点？谢谢。

使用而不是获取

li

的全部内容，而不仅仅是文本

e、 g

每次单击

li

时，您还将为其分配一个新的单击事件

您应该删除

clickbanks

功能，并在文档准备就绪时分配一次click事件。您还必须将其从

li

的

onclick

属性中删除

e、 g

---

你可以试试jQuery和@AniketG，恐怕你需要做得更好。嗯，什么？做得更好？可能是@Aniket的复制品他们完全不同。hide（）不是一个选项。很抱歉，也许你需要完全理解我的问题和描述。完美的答案。谢谢

function clickbanks(){
    $(".menu-banknam li").click(function(){
        $(this).parents(".bb-container").find('.banknam').html($(this).text());
        return false;
    });
}

$(this).parents(".bb-container").find('.banknam').html($(this).html());

$(function() {
  $(".menu-banknam li").click(function() {
    $(this).parents(".bb-container").find('.banknam').html($(this).text());
    return false;
  });
});