I was hoping someone can point me in the right direction. I am looking to use this plugin along with jquery.validation plugin in my forms but from what I see I would need to use a select tag in order for creditcard2 to function correctly.

What I currently have is this:

1.     
2.  <p class="ccType">
3.          <label for="card_type" class="error">You must select a credit card from one of the following.</label>
4.             <br>
5.          <input type="radio" value="1000" id="card_type_1000" name="card_type" style="outline:none; border:none;" /> 
6.             <img src="../visa.png" alt="Visa" width="50" height="30" align="top" /> 
7.             <input type="radio" value="1002" id="card_type_1002" name="card_type" style="outline:none; border:none;" /> 
8.             <img src="../mastercard.png" alt="Mastercard" width="50" height="30" align="top" /> 
9.             <input type="radio" value="1006" id="card_type_1006" name="card_type" style="outline:none; border:none;" /> 
10.             <img src="../discover.png" alt="Discover" width="50" height="30" align="top" /> 
11.             <input type="radio" value="1004" id="card_type_1004" name="card_type" style="outline:none; border:none;" /> 
12.             <img src="../amex.png" alt="American Express" width="50" height="30" align="top" />
13.         </p>
 

value = 1000 is "Visa"

value = 1002 is "MasterCard"

value = 1006 is "Discover"

value = 1004 is "AmEx"

How can I get this to work with the set up that I currently have.

any suggestions?