title: Make a div or list element select/trigger a radio input button on click with jQuery?
body: <p>I'm not sure if this possible but probably is fairly simple.</p>
  
  <p>I've made a fiddle <a href="http://jsfiddle.net/WTSWP/1/" rel="nofollow noreferrer">http://jsfiddle.net/WTSWP/1/</a> or the kind of situation I'm in.</p>
  
  <p>I've got multiple radio inputs, each contained by a div/li, and what the containing element to select the radio button when clicked.</p>
  
  <p>I'm using jQuery to so if anyone has ideas using jquery that would be great thanks.</p>
  
  <p><br /></p>
  
  <p>I started this but isn't working right.</p>
  
  <pre><code>$(".select-area").click(function() {
      $(this).find('input').trigger('click');
  });
  </code></pre>
  
  <p><br /></p>
  
  <pre><code>&lt;li class="select-area"&gt;
  
       &lt;input type="radio" name="colour" value="black"&gt;
  
  &lt;/li&gt;
  </code></pre>
  
  <p><br /></p>
  
  <p><img src="https://i.stack.imgur.com/Yo0eb.png" alt="enter image description here"></p>
  
  <p><br /></p>
  
  <p>Fiddle here <a href="http://jsfiddle.net/WTSWP/1/" rel="nofollow noreferrer">http://jsfiddle.net/WTSWP/1/</a></p>