Заполнить SPAN с значением SELECT

Question

Я все еще свежий для jQuery. Может быть, кто-то может указать мне в правильном направлении с моей проблемой.

У меня есть несколько предметов LI. Каждый из них содержит два элемента SELECT. Когда я нажимаю кнопку, я хочу отобразить два SPANS. Каждое из них содержит значение одного из SELECT.

Я получаю его для работы с одним LI. Но не больше. Я пробовал каждую функцию, но не могу заставить ее работать.

Может кто-нибудь помочь мне, пожалуйста?

$("##triggerButton").click(function() { 
      $("li").each(function(){ 
       var firstSelect = $('##Folder_ID').find(":selected").text(); 
       var secondSelect = $('##Type_ID').find(":selected").text(); 

       $('##folder-view').text(firstSelect);     
       $('##type-view').text(secondSelect); 
       }); 
    }); 

Answer 1

Без вашего HTML-кода, я думаю, что вы используете двойные идентификаторы и селектов выглядит как <select id="#folder-view">. Попробуйте этот код:

$(document).ready(function() { 
 
    $("button").click(function() { 
 
    $.each($("#wrapper-of-selections .selection"), function() { 
 
     $("#result").append(
 
     "<span>" 
 
     + $("option:selected", this).val() + ": " + $("option:selected", this).text() 
 
     + "</span><br/>" 
 
    ); 
 
    }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul id="wrapper-of-selections"> 
 
    <li> 
 
    <select class="selection"> 
 
     <option value="v11">Value 11</option> 
 
     <option value="v21">Value 21</option> 
 
    </select> 
 
    </li> 
 
    <li> 
 
    <select class="selection"> 
 
     <option value="v12">Value 12</option> 
 
     <option value="v22">Value 22</option> 
 
    </select> 
 
    </li> 
 
</ul> 
 
<button>Click ME</button> 
 
<br/> 
 
<span id="result"></span>