jquery button event function to target button by ID -

i have page full of divs contain 1 button each submit function successfully.

however trying isolate buttons id , trigger addition of class , message 2 spots within div (input value & #msgsc).

however, event not triggering @ all. , think may missing something. how can change/add class , message sibling input tag , #msgsc of particular button clicked (and not of inputs in divs on page simultaneously)?

<form id="hello" target="someplace" action="#" method="post">     <table>         <tr>             <td>                 <select name="os0">                     <option value="item1">item1</option>                     <option value="item2">item2</option>                     <option value="item3">item3</option>                     <option value="item1">item4</option>                 </select>             </td>         </tr>         <tr>             <td>                 <input type="hidden" name="on1" value="send url"/>send url             </td>         </tr>         <tr>             <td>                 <input type="text" value="http://" name="os1" id="os1" maxlength="200"/>             </td>         </tr>     </table>     <button alt="click button" id="purchase1" name="submit" class="btn" type="image">add cart</button> </form>     $(document).ready(function () {     $('#purchase1, #purchase2, #purchase3').on('click', 'button', function (e) {         var urlgo = new array(url1, url2, url3);          (var x = 0; x < urlgo.length; x++) {              if (!/(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\s+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/.test(urlgo[x].val())) {                 $(this).siblings("input[type=text]").addclass("erroralert");                 $(this).siblings("input[type=text]").val(emptyerror);                 $(this).siblings("#msgsc").addclass("text-error");                 $(this).siblings("#msgsc").html(htmlempty);              } //end of if         } //end of     }); // end of purchase button function }); // end document ready 

. refers class, # id.

.purchase selects element of class purchase, #purchase selects element of id purchase.

use

$('#purchase1, #purchase2, #purchase3').on(... 

since purchase1, purchase2, purchase3 ids.

and if interested on clicks , these elements loaded once , not replaced or removed, may use,

$('#purchase1, #purchase2, #purchase3').click(function(){.. 

you may give common class them, "purchase".

and use,

$('.purchase').click(function(){  ....}); 

but remember, id's unique.