I have a list of elements with an "add to cart" button on the left (cart installed with a Wordpress Plugin). When I click on the button that element is added to a shopping cart (no new page opened, it just shows an "added" message). I'd like to have a final link "add all elements to cart" which, if clicked, clicks simultaneously all "add to cart" buttons. My PROBLEM is: i can't use a selector related to the "add to cart" button, because the add to cart button has not a unique id, just a class, which is always the same for all buttons (and I can't change it). But I managed to close the button inside a div which has a unique class attribute related to the product. So, this is the code situation for the buttons:
// Product 1
<div class="cart1">
<form action="http://url" method="post">
<fieldset>
<input class="button" value="Add to cart" title="Add product to cart" type="submit" />
</fieldset>
</form>
</div>
// Product 2
<div class="cart2">
<form action="http://url" method="post">
<fieldset>
<input class="button" value="Add to cart" title="Add product to cart" type="submit" />
</fieldset>
</form>
</div>
For the jquery code I thought that some click function would be ok, something like
<a onclick="functionClick1();functionClick2();">Add every product to cart</a>
for the html, and
functionClick1() {
$("").click();
}
for the javascript. But what can I put inside the quotation marks, since the add to cart button has not a unique class or id? How can I tell him: click the button contained inside the div class="cart1" element? Thanks everyone!
