title: How to iterate through input's content
body: <p><a href="https://i.stack.imgur.com/n6Jvk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/n6Jvk.png" alt="enter image description here"></a></p>
  
  <p>As you guys can see, I have two columns: <strong>Name</strong> and <strong>Tickets</strong>.<br>
  So John has 15 tickets, bob 10 and so on...</p>
  
  <p>Objective: I want to make some sort of "lottery" where each person has X tickets. More tickets the more chance you have to win the prize.  </p>
  
  <p>I was trying to get both column separated by its class and then create some sort of "main array/object" something like this: </p>
  
  <pre><code>lottery = {
     John =&gt; 15
     Bob  =&gt; 10
     Milla =&gt; 7
  }
  </code></pre>
  
  <p>And then I would try to pick a winner randomly...  Just don't know how to do it.  </p>
  
  <p>Here I'm getting the inputs but I don't know how to "connect" them.</p>
  
  <pre><code>$('#sort').click(function(){
  
     let names = $('.names');
     let tickets = $('tickets');
     let size = Object.keys(names).length;
  }
  </code></pre>
  
  <p>HTML Structure:</p>
  
  <pre><code>&lt;section id="content"&gt;
        &lt;div class="container participant"&gt;
           &lt;div class="row"&gt;
  
              &lt;div class="input-group"&gt;
                 &lt;div class="input-group-prepend"&gt;
                 &lt;span class="input-group-text"&gt;Nome &amp; Tickets&lt;/span&gt;
               &lt;/div&gt;
  
                 &lt;input type="text" aria-label="name" class="names form-control"&gt;
                 &lt;input type="text" aria-label="tickets" class="tickets form-control"&gt;
  
  
                 &lt;div class="input-group-append"&gt;
                    &lt;button class="addUser btn btn-outline-secondary" type="button"&gt;
                       &lt;i class="fas fa-user-plus" data-toggle="tooltip" data-placement="top" title="" data-original-title="Add participante"&gt;&lt;/i&gt;
                    &lt;/button&gt;
                 &lt;/div&gt;
              &lt;/div&gt;
  
           &lt;/div&gt;
        &lt;/div&gt;
     &lt;/section&gt;
  </code></pre>