Условие JQuery
 

Уважаемые гуру, подскажите, что делаю не то. Пишу так:

<script>
(function($) {
$(function() {
	
$( "div.radio" ).on( "click", function() {	
	
	
	if($("#s1").is(":checked")) {
		  $('ul.color').on('click', 'li', function() {
			      $(this)
				  .addClass('active').siblings().removeClass('active')
				  .closest('div.3d').find('.sm-v div.image').removeClass('active').eq($(this).index()).addClass('active');
		  });
	} 
	else if ($("#s2").is(":checked")) {
		  $('ul.color').on('click', 'li', function() {
			      $(this)
				  .addClass('active').siblings().removeClass('active')
				  .closest('div.3d').find('.sp-v div.image').removeClass('active').eq($(this).index()).addClass('active');
		  });
	} 
	else if ($("#s3").is(":checked")) {
		  $('ul.color').on('click', 'li', function() {
			      $(this)
				  .addClass('active').siblings().removeClass('active')
				  .closest('div.3d').find('.sp-v div.image').removeClass('active').eq($(this).index()).addClass('active');
		  });
	}
	
});


});
})(jQuery);

</script>

Это условия для чекнутых радиобатаннов, они срабатывают, но когда я возвращаюсь и кликаю например снова на #s1 (после s2/s3), то не выполняется условие .find('.sm-v div.image'), а так и продолжает выполняться .find('.sp-v div.image'). Подскажите, что не так.

Покажите код кнопок, включая родителей и прочих к которым обращение.

else if ($("#s3").is(":checked")) - меняя только селектор, и опять id (!), а действия одинаковые, так не стоит делать.

Пробовала объединить && - не работал код, наверное потому что коряво писала)))

Код:

<div class="radio">
<input type="radio" name="gender" id="s1" value="Металл"><label for="s1">Металл</label>
<input type="radio" name="gender" id="s2" value="Пластик импортный"><label for="s2">Пластик импортный</label>
<input type="radio" name="gender" id="s3" value="Пластик российский"><label for="s3">Пластик российский</label>
</div>

<ul class="color"> 
 <li id="1013"><img src="/multifile/2678/1013.png"></li>
 <li id="1015"><img src="/multifile/2678/1015.png"></li>
 <li id="1019"><img src="/multifile/2678/1019.png"></li>
 <li id="2009"><img src="/multifile/2678/2009.png"></li>
</ul>

Все получилось, когда поправила так:

if($("#s1").is(":checked")) {
		  $('ul.color').on('click', 'li', function() {
			      $('.3d').find('div.sm-v div.image').removeClass('active').eq($(this).index()).addClass('active');
			      $('.3d').find('div.sp-v div.image').removeClass('active');
		  });
	} 
	else if ($("#s2").is(":checked")) {
		  $('ul.color').on('click', 'li', function() {
			      $('.3d').find('div.sp-v div.image').removeClass('active').eq($(this).index()).addClass('active');
			      $('.3d').find('div.sm-v div.image').removeClass('active');

		  });
	};

:dance: :victory: :D :write:

Heny,
попробуйте никогда не назначать клик в клике и вы спасёте ресурсы браузера и клиента

if($("#s1").is(":checked")) {
          $('ul.color').on('click', 'li', function() {

так нельзя?

Почему-то вся данная конструкция не работает в IE((( Не подскажете в чем загвоздка?

так ненужно
лучше опишите алгоритм того что хотите сделать

Так наверное лучше посмотреть?
вот тут сижу ковыряю
http://www.laminar.ru/test/test-6.html

А не работает вот это:

else if ($("#s2, #s3").is(":checked")) {

Как надо написать для IE?

Heny,
если клик по ссылке отмените переход, если сто раз назначаите клик , отмените предыдущие клики.

<script>
(function($) {

$(function() {
	$('ul.btn').on('click', 'li:not(.active)', function(event) {
	  event.preventDefault();
			$('.3d').find('div.variant div.el').removeClass('active').eq($(this).index()).addClass('active');
	});

});

})(jQuery);
</script>
<script>
(function($) {
$(function() {

$( "div.radio" ).on( "click", function() {


    if($('#pol1').is(":checked")) {
			      $('#pol').find('div.panel2').removeClass('el1');
			      $('#pol').find('div.panel22').addClass('el1');
                  $('ul.color2').off().on('click', 'li', function(event) {  event.preventDefault();
			        $('.konf3d').find('div.pl div.image').removeClass('active').eq($(this).index()).addClass('active');
			        $('.konf3d').find('div.pn div.image').removeClass('active');
                  });
	}
    else if($('#pol2').is(":checked")) {
			      $('#pol').find('div.panel22').removeClass('el1');
			      $('#pol').find('div.panel2').addClass('el1');
                  $('ul.color3').off().on('click', 'li', function(event) {  event.preventDefault();
			        $('.konf3d').find('div.pn div.image').removeClass('active').eq($(this).index()).addClass('active');
			        $('.konf3d').find('div.pl div.image').removeClass('active');
                  });
	};
	if($("#s1").is(":checked")) {
		  $('ul.color').off().on('click', 'li', function(event) {  event.preventDefault();
			      $('.3d').find('div.sm-v div.image').removeClass('active').eq($(this).index()).addClass('active');
			      $('.3d').find('div.sp-v div.image').removeClass('active');
		  });
	}
	else if ($("#s2:checked, #s3:checked").length) {
		  $('ul.color').off().on('click', 'li', function(event) {    event.preventDefault();
			      $('.3d').find('div.sp-v div.image').removeClass('active').eq($(this).index()).addClass('active');
			      $('.3d').find('div.sm-v div.image').removeClass('active');

		  });
	};

});


});
})(jQuery);

</script>