viewportの書き換えがjQueryで上手く動かないとき

このような感じで動かしてみたところ、上手く動きませんでした。

<meta content="width=device-width,initial-scale=1.0,minimum-scale=1.0" name="viewport">
<script>
    if(screen.width < 375) $("meta[name='viewport']").attr('content', 'width=375'); }
</script>

エラーは出ませんが、値が変更されません。

解決策が見当たらないため、jQueryを使用せずに書いたところ、動きました。

<meta content="width=device-width,initial-scale=1.0,minimum-scale=1.0" id="viewport" name="viewport">
<script>
    if(screen.width < 375) document.getElementById('viewport').setAttribute('content', 'width=375');
</script>

もしくは、

<script>
    document.write('<meta name="viewport" content="' + (screen.width < 375 ? 'width=375' : 'width=device-width,initial-scale=1.0,minimum-scale=1.0') + '">');
</script>

ちなみに、なぜこういうことをしているかというと、Webサイトのデザインデータのベースが375pxなのに、 320pxのデバイスにも対応してくれということがあり、面倒くさくて、viewportで対応しちゃいました。