jQuery data attribute selector issue

Question

I am trying to show some span`s with data attribute base on select options available.

I am using the below code

  $("#pa_varsta option").each(function(i){
        var marime =  $(this).val();
        $('.tawcvs-swatches [data-value=' + marime + ']').show();
    });

But i get the error

jquery.js?ver=1.12.4:2 Uncaught Error: Syntax error, unrecognized expression: .tawcvs-swatches [data-value=]

I am using Wordpress.

Any ideea, maybe regarding the jquery version?

Answer 1

.val() is only for input elements not for an <option> element. Use .text() instead.

$("#pa_varsta option").each(function(i){
  var marime =  $(this).val();
  $('.tawcvs-swatches [data-value="' + marime + '"]').show();
});

It is safer to surround the attribute's value with a quote. Because sometimes, it will break the selector.