jquery - I have to change the background of div of previously checked radio buttons? But i am getting problems -
i getting problem in changing css of div of checked radio buttons. jquery code on load page:
var check = jquery('input:radio').is(':checked'); if (check == true) { //jquery('input:radio').closest('.swatch').find('div.new').removeclass('new'); jquery('.swatch-element').addclass('new'); } else { jquery('.swatch-element').removeclass('new'); }
my list structure:
<div data-option-index="0" class="swatch clearfix swatch-0"> <div class="header">weight</div> <div class="swatch-element 1-pound available new" data-value="1 pound"> <input type="radio" checked="" value="1 pound" name="option-0" id="swatch-0-1-pound"> <label for="swatch-0-1-pound"> 1 pound <img src="//cdn.shopify.com/s/files/1/1313/8977/t/3/assets/soldout.png?10509341804900951712" class="crossed-out"> </label> </div> <script> jquery('.swatch[data-option-index="0"] .1-pound').removeclass('soldout').addclass('available').find(':radio').removeattr('disabled'); </script> <script> jquery('.swatch[data-option-index="0"] .1-pound').removeclass('soldout').addclass('available').find(':radio').removeattr('disabled'); </script> <div class="swatch-element 2-pounds available new" data-value="2 pounds"> <input type="radio" value="2 pounds" name="option-0" id="swatch-0-2-pounds"> <label for="swatch-0-2-pounds"> 2 pounds <img src="//cdn.shopify.com/s/files/1/1313/8977/t/3/assets/soldout.png?10509341804900951712" class="crossed-out"> </label> </div> <script> jquery('.swatch[data-option-index="0"] .2-pounds').removeclass('soldout').addclass('available').find(':radio').removeattr('disabled'); </script> <script> jquery('.swatch[data-option-index="0"] .2-pounds').removeclass('soldout').addclass('available').find(':radio').removeattr('disabled'); </script> </div>
i don't know how check each element?i getting confused in structure , selector of jquery.
if understand want :
$("input:radio").each(function() { if($(this).is(':checked')) { $('.swatch-element').addclass('new'); } else { $('.swatch-element').removeclass('new'); } });
is ok?
you can use <script>
several javascript lines.
Comments
Post a Comment